Skip to content
master
Switch branches/tags
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

ractive-component-loader for webpack

Exports a Ractive component as a Ractive constructor function for webpack.

Status

Usage

Documentation: using loaders

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).

About

ractive component loader for webpack

Resources

Releases

No releases published