modify-loader

LoDash templates loader for webpack. The compiled string returned.

Usage no npm install needed!

<script type="module">
  import modifyLoader from 'https://cdn.skypack.dev/modify-loader';
</script>

README

modify-loader

==================

NPM version

LoDash templates loader for webpack. The compiled string returned.

Installation

npm install modify-loader --save-dev

Usage

file.css

body{
    background-color: <%= data.color %>;
}
var options = JSON.stringify({ variable: 'data' });
var value = JSON.stringify({ color: '#000' });

var template = require("modify!./file.css?options=" + new Buffer(options).toString('base64') + '&value=' + new Buffer(value).toString('base64'));
// => returns the compiled string with lodash templating method.
console.log(template);
// body{
//     background-color: #000;
// }

Config

This webpack config can load arbitrary text files.

var options = JSON.stringify({ variable: 'data' });

module.exports = {
  module: {
    loaders: [
      { test: /\.css$/, loader: "style!css!modify?options=" + new Buffer(options).toString('base64') }
    ]
  }
};

is equivalent to

var template = _.template('body{  background-color: <%= data.color %>;  }', {variable: 'data'})({color: '#000'});

The options is optional, and the same as lodash-template-options The value will be used as interpolated data

Special Case

Since JSON doesn't support regular expression, so it's not possible to pass a RegExp directly, which means for following options, we need workaround for them:

  • escape
  • evaluate
  • interpolate

For solving this issue, we pass Object which contains pattern and attributes as following:

var options = JSON.stringify({
    variable: 'data',
    interpolate: {
        pattern: '%([\\s\\S]+?)%',
        attributes: 'g'
    }
});

var value = JSON.stringify({ color: '#000' });

module.exports = {
  module: {
    loaders: [
      { test: /\.css$/, loader: "style!css!modify?options=" + new Buffer(options).toString('base64') + '&value=' + new Buffer(value).toString('base64') }
    ]
  }
};

LICENSE

MIT License