rollup-plugin-html-literals

2.0.1 verified Mon Apr 27 auth: no javascript

A Rollup plugin (v2.0.1) that minifies HTML in tagged template literals, specifically for lit-html and other HTML-in-JS libraries. Currently stable with active maintenance; released as a compatibility fix for newer Rollup versions (^2.x.x, ^3.x.x, ^4.x.x). Unlike rollup-plugin-minify-html-literals, this plugin supports Rollup v3+ and is written in TypeScript, providing type definitions. It relies on minify-literals under the hood and must run before transpilation. Ideal for reducing bundle size in LitElement or similar projects.

Common errors

error Error: Could not resolve 'minify-literals' ↓

cause Missing dependency minify-literals (not automatically installed as peer dependency).

fix

Run npm install minify-literals --save-dev

error TypeError: template is not a function ↓

cause Incorrect import: using named import instead of default import.

fix

Use import template from 'rollup-plugin-html-literals'

error Error: The plugin must be placed before transpilation plugins ↓

cause Order of plugins in Rollup config: template() after Babel/TypeScript.

fix

Move template() before transpile plugins in plugins array.

error Unexpected token: punc (.) - Template literals not minified ↓

cause Rollup version is <2 and not supported by this plugin.

fix

Upgrade Rollup to ^2.0.0 or later, or use rollup-plugin-minify-html-literals for older versions.

Warnings

gotcha Plugin must run before transpilation (e.g., before Babel or TypeScript) to avoid mangled code. ↓

fix Place template() before transpile plugins in the plugins array.

gotcha Only minifies template literals tagged with html; other tags like css or custom tags are not processed by default. ↓

fix Use minifyHTMLLiterals option to customize the minification function or configure minify-literals options accordingly.

deprecated The minifyHTMLLiterals option is deprecated in favor of options.customMinifiers or direct minify-literals configuration. ↓

fix Refer to minify-literals documentation for custom minification.

gotcha When using include/exclude patterns, they are relative to the project root and must match full paths after Rollup resolves them. ↓

fix Use patterns like 'src/**/*.js' instead of just '*.js'.

Install

npm install rollup-plugin-html-literals

yarn add rollup-plugin-html-literals

pnpm add rollup-plugin-html-literals

Imports

default import (plugin function)

wrong

import { template } from 'rollup-plugin-html-literals'

correct

import template from 'rollup-plugin-html-literals'

The plugin is exported as a default function, not a named export.

CommonJS require

wrong

const { template } = require('rollup-plugin-html-literals')

correct

const template = require('rollup-plugin-html-literals')

For CJS projects, use default require. Named destructuring fails.

TypeScript import

wrong

import * as template from 'rollup-plugin-html-literals'

correct

import template from 'rollup-plugin-html-literals'

Plugin ships TypeScript types; default import works with esModuleInterop.

Quickstart

Basic Rollup config using the plugin to minify HTML template literals in all JS files, excluding node_modules.

import template from 'rollup-plugin-html-literals';

export default {
  input: 'src/index.js',
  output: {
    file: 'dist/bundle.js',
    format: 'esm'
  },
  plugins: [
    template({
      include: ['**/*.js'],
      exclude: ['node_modules/**'],
      failOnError: false,
      options: {
        minifyOptions: {
          collapseWhitespace: true,
          conservativeCollapse: true
        }
      }
    })
  ]
};