Use with Bundlers

[EisenbergEffect]

This library looks quite useful for our scenarios. I'm particularly interested in seeing how this could be used in combination with a bundler. Do you have any examples of using this as part of a Webpack or Rollup build?

[EisenbergEffect]

Just found this for Rollup: https://github.com/asyncLiz/rollup-plugin-minify-html-literals 😄

Any tips on doing this in Webpack? I imagine we can write a custom Webpack plugin, but thought I would check just in case you happened to have some code lying around somewhere.

Thanks!

[asyncLiz]

The reason I broke this library out was to encourage others to integrate it into their own build systems! I personally use rollup a lot in my projects, so I built a rollup plugin.

My hope is that other developers would create plugins/loaders for their favorite build systems. So while yes, you could just create a custom plugin, I'd encourage you to publish it to npm as well and share it with others 😊

As far as tips, I'd recommend looking at my rollup plugin's index.ts file and reading through https://webpack.js.org/contribute/writing-a-loader and https://webpack.js.org/api/loaders/.

Basically, you just need to get the minify options the user wants for the loader, apply the transformation, and return the result.

Roughly:

export default function(source) {
  const options = getOptions(this);
  validateOptions(schema, options, 'minify-html-literals loader');

  const result = minifyHtmlLiterals(source, options);
  if (result) {
    // include both code and sourcemap
    this.callback(null, result.code, result.map);
    return;
  } else {
    // nothing was minified
    return source;
  }
}

[EisenbergEffect]

Thanks @asyncLiz !

[Westbrook]

@EisenbergEffect, you wouldn't happen to have done anything public around binding this to webpack?