ractive-component-loader
v2.0.0
Published
ractive component loader module for webpack
Downloads
184
Readme
ractive-component-loader for webpack
Exports a Ractive component as a Ractive constructor function for webpack.
Usage
Quick start guide
Install this into your project:
$ npm install --save ractive-component-loader
Make all your .html
files compile down to [Ractive] templates by
modifying your webpack.config.js
file:
/* webpack.config.js */
module.exports = {
module: {
loaders: [
{ test: /\.html$/, loader: 'ractive-component' }
]
},
...
};
Then use your Ractive components via require()
:
<!-- mycomponent.html -->
<import rel="ractive" href="./subcomponent.html">
<div>Hello {{subject}}!</div>
<subcomponent></subcomponent>
<script>
component.exports = {
data: { subject: 'World' }
};
</script>
<!-- subcomponent.html -->
Subcomponent are required correctly
var Component = require('./mycomponent.html');
new Component({ el: document.body });
Alternate usage
You can also use it without modifying your config. Just explicitly call it on
your require()
call via a prefix:
var Component = require('ractive-component!./mycomponent.html');
Thanks
ractive-component-loader © 2014+, Blake Thomson. Released under the MIT License. Authored and maintained by Blake Thomson with help from contributors (list).