snowpack-plugin-minify-html-literals

snowpack-plugin-minify-html-literals is a snowpack plugin to minify HTML template literal strings, using minify-html-literals.

Installation

npm install -D snowpack-plugin-minify-html-literals

Usage

Tagged templates

// snowpack.config.mjs
export default {
  plugins: ['snowpack-plugin-minify-html-literals'],
};

// index.js
const html = (strings) => strings.raw[0];
const template = html`
  <div>
    <p>Hello, World!</p>
  </div>
`;

const body = document.querySelector('body');
body.innerHTML = template;

// A transformation result of index.js
const html = (strings) => strings.raw[0];
const template = html`<div><p>Hello, World!</p></div>`;

const body = document.querySelector('body');
body.innerHTML = template;

Non-tagged templates

// snowpack.config.mjs
export default {
  plugins: [[
    'snowpack-plugin-minify-html-literals',
    {
      options: {
        shouldMinify: (template) => {
          return template.parts.some(part => part.text.includes('data-minify="true"'));
        },
      },
    },
  ]],
};

// index.js
const template = `
  <div data-minify="true">
    <p>Hello, World!</p>
  </div>
`;

const body = document.querySelector('body');
body.innerHTML = template;

// A transformation result of index.js
const template = `<div data-minify="true"><p>Hello, World!</p></div>`;

const body = document.querySelector('body');
body.innerHTML = template;

Options

// snowpack.config.mjs
export default {
  plugins: [[
    'snowpack-plugin-minify-html-literals',
    {
      options: null, // minify-html-literals options. See https://github.com/asyncLiz/minify-html-literals#options
      exts: ['.js', '.mjs', '.ts'], // target file extensions
    }
  ]],
};