@beyonk/rollup-plugin-html-esm

Generates html for modular ECMAScript

Usage no npm install needed!

<script type="module">
  import beyonkRollupPluginHtmlEsm from 'https://cdn.skypack.dev/@beyonk/rollup-plugin-html-esm';
</script>

README

@beyonk/rollup-plugin-generate-html-esm

js-standard-style CircleCI

Simple rollup plugin to generate html file and inject your output module into it. Supports ES Modules / Code-splitting. Currently html file will be placed in same directory as the output file. This plugin is inspired from rollup-plugin-generate-html.

Installation

npm install --save-dev @beyonk/rollup-plugin-html-esm

Usage

import html from '@beyonk/rollup-plugin-html-esm'

export default [{
  input: 'main.js',
  output: {
    file: 'bundle.js',
    format: 'umd'
  },
  plugins: [
    html({
      // specify template html (optional)
      template: './index.html',  // Default undefined
      // output filename (optional)
      filename: 'some.html', // Default index.html
      // when specified, js src will use absolute path from publicPath (optional)
      publicPath: 'dist' // Default undefined
    })
  ]
}]

Advanced usage

For cases when you want to generate html file per output. This should come in handy when you want to generate book example codes and such.

import glob from 'glob'
import html from '@beyonk/rollup-plugin-html-es'

const configs = glob
  .sync('src/**/index.js')
  .map(input => ({
    input,
    output: [{ file: input.replace(/^src/, 'dist'), format: 'umd' }],
    plugins: [html()],
  }))

export default configs