ractive-component-loader

    2.0.0 • Public • Published

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

    Install

    npm i ractive-component-loader

    DownloadsWeekly Downloads

    57

    Version

    2.0.0

    License

    MIT

    Unpacked Size

    3.86 kB

    Total Files

    5

    Last publish

    Collaborators

    • gtyree
    • ebinmore
    • gesteves
    • pablo.mercado
    • jplhomer
    • thomsbg