Registry / web-framework / ko-component-compiler

ko-component-compiler

JSON →
library0.5.0jsnpmunverified

A single-file component compiler for Knockout.js, enabling Vue-like component authoring with <template>, <style scoped>, and <script> blocks. Version 0.5.0 is currently the latest and appears to be in early development with minimal release activity. Key differentiators: supports scoped styles, rollup integration via rollup-plugin-ko, and automatic component registration. Requires peer dependencies insert-css and robust-mixin.

web-framework
npm install ko-component-compiler
package ↗
INSTALL
IMPORT
SIG · KO-COMPONENT-COMPI
K
ko-component-compiler
web-frameworkjavascriptv0.5.0
harness data pending
Install & Compatibility
Where this runs

No compatibility data collected yet for this library.

Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

compiler
✓ import { compile } from 'ko-component-compiler'
✗ const compiler = require('ko-component-compiler').default
The main export is a function, not an object with a default export.
compile
✓ import { compile } from 'ko-component-compiler'
✗ import compile from 'ko-component-compiler'
The package exports a named function, not a default export.
rollup-plugin-ko
✓ import ko from 'rollup-plugin-ko'
✗ import { ko } from 'rollup-plugin-ko'
rollup-plugin-ko is a default export.

Demonstrates compiling a single-file component using the ko-component-compiler compiler.compile() function.

const compiler = require('ko-component-compiler'); const source = `<template> <div class="btn"> <span data-bind="text: text"></span> </div> </template> <style scoped> .btn { color: red; } </style> <script> export default { constructor: function (opts, info) { this.text = ko.observable(opts.text || 'Button'); } }; </script>`; compiler.compile(source, function (err, result) { if (err) { console.error(err); } else { console.log(result); } });
Debug
Known issues
gotchaThe package uses a callback-based API; async/await not directly supported.
fix
Wrap callback in a Promise or promisify the function.
affects: >=0.5.0
gotchaRollup integration requires multiple plugins: rollup-plugin-ko, rollup-plugin-babel, rollup-plugin-commonjs, rollup-plugin-node-resolve. Missing any will cause build failures.
fix
Install all required rollup plugins and peer dependencies as shown in README.
affects: >=0.5.0
gotchaThe component script must use `export default` with a constructor and can include defaults, mixins, methods. Misusing the structure leads to runtime errors.
fix
Ensure script block matches the expected ES module export pattern.
affects: >=0.5.0
Errors
Common errors & fixes
Cannot find module 'insert-css'
Missing peer dependency insert-css
fix
npm install insert-css
compiler.compile is not a function
Incorrect import: using default import instead of named import
fix
Use `import { compile } from 'ko-component-compiler'` or `const { compile } = require('ko-component-compiler')`
Unexpected token 'export'
Component script uses ES module syntax but babel plugin is not configured properly
fix
Add rollup-plugin-babel with es2015-rollup preset as shown in README.
Upgrade
Version history
0.5.0latest on npm
Audit
Dependencies
insert-cssrequiredPeer dependency for injecting component styles
robust-mixinrequiredPeer dependency for mixin functionality
Agent activity
2 hits · last 30 days
node
2
Resources
packagehttps://www.npmjs.com/package/ko-component-compiler ↗
ko-component-compiler — npm install ko-component-compiler · libregistry