Mustache loader for webpack
Compiles Mustache templates with Hogan and optionally html-minifier.
Install
$ npm i -S mustache-loader
Usage
webpack@1.x
module: {
loaders: [ {
test: /\.html$/,
loader: 'mustache'
// loader: 'mustache?minify'
// loader: 'mustache?{ minify: { removeComments: false } }'
// loader: 'mustache?noShortcut'
} ]
}
webpack@2.x
module: {
rules: [ {
test: /\.html$/,
loader: 'mustache-loader'
// loader: 'mustache-loader?minify'
// loader: 'mustache-loader?{ minify: { removeComments: false } }'
// loader: 'mustache-loader?noShortcut'
} ]
}
var template = require('./template.html');
var html = template({ foo: 'bar' });
If noShortcut is passed, then Hogan compiled template is returned instead, so
you can pass it as partial.
var template = require('./template.html');
var template2 = require('./template2.html');
var html = template.render({ foo: 'bar' }, {partial: template2});
If clientSide is passed in, then Hogan will not pre-compile the template.
If tiny is passed in, the source of the template will not be emitted, creating a smaller output.
if render is passed in, the data is sent is used to immediately render the template. Render may be an object or a function which returns an object (in order to allow the data to change over time, e.g. to support hot reloading).
For example, the following will render index.mustache with the provided data (title), which can immediately be used by HtmlWebpackPlugin.
module: {
rules: [ {
test: /index\.mustache$/,
loader: 'mustache-loader',
options: {
tiny: true,
render: {
title: 'hello world',
},
},
} ]
}
plugins: [
new HtmlWebpackPlugin({
template: 'index.mustache',
inject: 'body',
}),
]
If another loader is chained after Mustache-Loader then the minify, clientSide, and tiny options will be ignored.
Any additional Hogan parameters passed into this loader will be passed through to Hogan.
Documentation: Using loaders.
License
WTFPL
