Liquid Loader

Webpack loader to process Liquid using liquidjs.

Install

npm install --save-dev liquidjs-loader

Usage

// webpack.config.js 
module.exports = {
    ...
    module: {
        rules: [{
          test: /\.liquid$/i,
          use: [
            'html-loader',
            {
              loader: 'liquidjs-loader',
              options: {
                  //All liquidjs options are valid here
                data: {
                  // your data goes here
                }
              }
            }
          ]
        }]
    }
};

Examples

webpack.config.js

module.exports = {
  ...
  module: {
    rules: [
      {
        test: /\.liquid$/i,
        use: [
          'html-loader',
          {
            loader: 'liquidjs-loader',
            options: {
              extname: '.liquid',
              data: {
                name: 'Test'
              }
            }
          }
        ]
      }
    ],
  }
};

src/index.liquid

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Webpack testing</title>
  <meta name="viewport" content="width=device-width, initial-scale=1"></head>
  <body>
  <h2>{{name | capitalize}}</h2>
  </body>
</html>

Dependencies

License

liquidjs-loader is released under the MIT license.