@wpe-tkpd/html-webpack-exclude-assets-plugin

Exclude Assets extension for the HTML Webpack Plugin

---- Start of forked information ----

• Adding full support for webpack v5 and html-webpack-plugin v4
• Change compilation get hooks

// from this
compilation.hooks.htmlWebpackPluginAlterAssetTags.tapAsync(this.PluginName, registerCb);
// to this
HtmlWebpackPlugin.getHooks(compilation).alterAssetTags.tapAsync(this.PluginName, registerCb);

• Hooks alterAssetTags now not give arguments head and body, so we modify the pluginData.assetTags.scripts and pluginData.assetTags.styles

---- End of forked information ----

Enhances html-webpack-plugin functionality by adding the {excludeAssets: RegExp | [RegExp]} option to allow you to exclude assets.

When adding an entry with third party css files, for example, style: ['bootstrap/dist/css/bootstrap.css'], to webpack, the injected scripts include style.js or style.[chunkhash].js. The excludeChunks option of html-webpack-plugin will exclude both style.css and style.js. With this plugin, you can keep style.css in and style.js out by setting excludeAssets: /style.*.js/.

You can also exclude CSS assets, for example, a theme CSS style, by setting excludeAssets: /theme.*.css/.

Installation

You must be running webpack on Node v4.0.0 or higher.

Note: style-loader's dependency loader-utils only supports Node v4.0.0 since v1.0. See style-loader's #174 pull request for details.

Install the plugin with npm:

$ npm install --save-dev html-webpack-exclude-assets-plugin

Basic Usage

Require the plugin in your webpack config:

var HtmlWebpackExcludeAssetsPlugin = require('html-webpack-exclude-assets-plugin');

Add the plugin to your webpack config as follows:

plugins: [
  new HtmlWebpackPlugin(),
  new HtmlWebpackExcludeAssetsPlugin()
]

The above configuration will actually do nothing due to the configuration defaults.

When you set excludeAssets to an array of regular expressions or a single regular expression, the matched assets will be skipped when the chunks are injected into the HTML template.

plugins: [
  new HtmlWebpackPlugin({
    excludeAssets: [/style.*.js/] // exclude style.js or style.[chunkhash].js
  }),
  new HtmlWebpackExcludeAssetsPlugin()
]