https://github.com/differui/ko-component-compiler
Compile Knockout Component
https://github.com/differui/ko-component-compiler
component knockoutjs
Last synced: 6 months ago
JSON representation
Compile Knockout Component
- Host: GitHub
- URL: https://github.com/differui/ko-component-compiler
- Owner: differui
- Created: 2016-03-20T03:06:31.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2018-04-24T02:32:04.000Z (almost 8 years ago)
- Last Synced: 2025-05-31T17:33:24.709Z (8 months ago)
- Topics: component, knockoutjs
- Language: JavaScript
- Size: 37.1 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Knockout Component Compiler
=====
## What is Knockout Component?
+ Let you write component in single file just like vue component.
+ Easy to write a component and no need to care about register.
```
.btn {
/* btn style goes here */
}
export default {
constructor: function (opts, info) {
this.text = ko.observable(opts.text);
this.icon = ko.observable(opts.icon);
},
defaults: {
text: 'Button'
},
mixins: [],
methods: {}
};
```
## API
```js
var compiler = require('ko-component-compiler');
compiler.compile('code', function (err, result) {
// component style template and script wrapped as single file
console.log(result);
});
```
## Rollup.js
Install packages:
```bash
# rollup plugins
$ npm install rollup-plugin-ko
$ npm install rollup-plugin-babel
$ npm install rollup-plugin-commonjs
$ npm install rollup-plugin-node-resolve
# peer deps
$ npm install inject-css
$ npm install robust-mixin
```
```js
var fs = require('fs');
var rollup = require('rollup');
var ko = require('rollup-plugin-ko');
var babel = require('rollup-plugin-babel');
var commonjs = require('rollup-plugin-commonjs');
var nodeResolve = require('rollup-plugin-node-resolve');
rollup.rollup({
entry: './src/main.js',
plugins: [
nodeResolve({ jsnext: true, main: true }),
commonjs(),
ko(),
babel({
presets: [
'es2015-rollup'
]
})
]
})
.then(function (bundle) {
var result = bundle.generate({
format: 'iife'
});
fs.writeFileSync( './dest/app.js', result.code );
})
.catch(function (err) {
console.log(err);
});
```