@glitchapp/merge-html-plugin NPM

Merge HTML Plugin

This package is part of Glitch project

An extension plugin for html-webpack-plugin to enable injection of custom HTML string

Installation

$ npm install @glitchapp/merge-html-plugin

Usage

// File: webpack.config.js
module.exports = {
  entry: './index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  plugins: [
    // NOTE: This is just for this example purpose, you DON'T need copy-webpack-plugin
    new CopyWebpackPlugin([
        { from: join(testDir, 'index.html'), to: 'custom.html' }
    ]),
    new HTMLWebpackPlugin({
        // ... HTMLWebpackPlugin options
    }),
    new MergeHTMLPlugin('custom.html')
  ]
}

<!-- File: user.html -->
<h1>Hello world!</h1>

The above configurations output something like:

<!-- File: dist/index.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Webpack App</title>
  </head>
  <body>
    <h1>Hello world!</h1>
  </body>
</html>

Options

new MergeHTMLPlugin(file)

Name	Type	Description
`file` (required)	`string`	The asset file to be merged

Contributing

We value and appreciate your help, please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Running the tests

$ npm test

Acknowledgments

Special thanks to Jan Nicklas for their awesome work in html-webpack-plugin

License

This project is licensed under the MIT License terms

7 years ago

7 years ago

7 years ago