html-add-asset-webpack-plugin

Webpack plugin to inject tags to html.

Installation

1npm install html-add-asset-webpack-plugin --save-dev

Usage

Add the plugin to your webpack config

1import { HtmlAddAssetWebpackPlugin } from 'html-add-asset-webpack-plugin';
2// or
3const { HtmlAddAssetWebpackPlugin } = require('html-add-asset-webpack-plugin');

1plugins: [
2  new HtmlWebpackPlugin({
3    filename: 'index.html'
4  }),
5  new HtmlWebpackPlugin({
6    filename: 'other.html',
7    tags: [
8      'simple.js',
9      {
10        tagName: 'script',
11        prepend: true,
12        attributes: {
13          src: 'special-script.js'
14        }
15      }
16    ]
17  }),
18  new HtmlAddAssetWebpackPlugin()
19];

To:

1<!-- index.html -->
2<script src="common-script.js"></script>
3
4<!-- other.html -->
5<script src="simple.js"></script>
6<script src="special-script.js"></script>
7<script src="common-script.js"></script>

Options

HtmlWebpackPlugin.Options.tags:

1interface Tag extends Omit<HtmlTagObject, 'voidTag'> {
2  voidTag?: boolean;
3  prepend?: boolean;
4  tagName: 'meta' | 'script' | 'style' | 'link';
5}
6
7type tags = (string | Tag)[];

Inspiration

This project is inspired by html-webpack-inject-plugin.