liquid-template-loader
v0.2.2
Published
Liquid template loader module for webpack
Downloads
21
Readme
Liquid Template Loader
Liquid template engine (see http://github.com/shopify/liquid) for webpack loader.
This loader was ported from liquid-loader (see https://github.com/azeeson/liquid-loader).
Getting Started
To begin, you'll need to install liquid-template-loader.
npm install --save-dev liquid-template-loaderindex.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Document</title>
</head>
<body>
<p>Hi {{ name }}</p>
</body>
</html>webapck.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
module: {
rules: [
{
test: /\.html$/,
use: [
{
loader: 'html-loader'
},
{
loader: 'liquid-template-loader',
options: {
data: {
'name': 'satoshi'
},
}
}
]
},
],
},
plugins: [
new HtmlWebpackPlugin({
template: __dirname + 'index.html',
})
]
}Usage
Add filters
options: {
...
filters: {
myFilter: input => {
return String(input).toUpperCase()
}
}
}
Add tags
options: {
...
tags: {
myTag: class MyTag extends Liquid.Tag {
render () {
return 'Hello World';
}
}
}
}For detail implementaion, you can see https://github.com/docs/liquid/tree/master/lib/liquid/tags.