SimenB · skimi · Mar 28, 2020
diff --git a/README.md b/README.md
@@ -58,7 +58,7 @@ look like:
 <!DOCTYPE html>
 <html>
  <head>
- <meta charset="UTF-8">
+ <meta charset="UTF-8" />
  <title>Webpack App</title>
  </head>
  <body>
@@ -149,6 +149,19 @@ An example of this is included in the repository.
 
 Currently only supports script tags.
 
+### `inject`
+
+Type: `boolean | function`, default: `true`
+
+Inject conditionally.
+
+This option accepts arguments of different types:
+
+- boolean `false`: disables injection `true`: enables injection (defaults)
+- function any predicate that takes an instance of html-webpack-plugin and
+ returns either `true` or `false` to control the injection of html metadata for
+ the html files generated by this instance.
+
 ## Examples
 
 When adding assets, it's added to the start of the array, so when

diff --git a/src/index.js b/src/index.js
@@ -85,6 +85,7 @@ export default class AddAssetHtmlPlugin {
  publicPath,
  outputPath,
  files = [],
+ inject = true,
  },
  ) {
  if (!filepath) {
@@ -95,6 +96,15 @@ export default class AddAssetHtmlPlugin {
 
  const fileFilters = Array.isArray(files) ? files : [files];
 
+ const shouldInject =
+ typeof inject === 'function'
+ ? inject(htmlPluginData.plugin)
+ : Boolean(inject);
+
+ if (!shouldInject) {
+ return;
+ }
+
  if (fileFilters.length > 0) {
  const shouldSkip = !fileFilters.some(file =>
  micromatch.isMatch(htmlPluginData.outputName, file),

diff --git a/test.js b/test.js
@@ -286,3 +286,79 @@ test('filepath without globbyMagic should just return', async () => {
  const ret = await handleUrl(assets);
  expect(ret).toHaveLength(1);
 });
+
+describe('inject assets conditionally', () => {
+ test('does not inject if false', async () => {
+ const compilation = { options: { output: { publicPath: 'vendor/' } } };
+ const pluginData = Object.assign(
+ { assets: { js: [], css: [] } },
+ pluginMock,
+ );
+ const plugin = new AddAssetHtmlPlugin({
+ filepath: path.join(__dirname, 'my-file.js'),
+ inject: false,
+ });
+
+ await plugin.addAllAssetsToCompilation(compilation, pluginData);
+
+ expect(pluginData.assets.js).toHaveLength(0);
+ });
+
+ test('if inject is a callback it gets called with the HtmlPlugin data', async () => {
+ const mock = {
+ plugin: {
+ options: {
+ HTML_PLUGIN_OPTION: 'hello',
+ },
+ },
+ };
+
+ const compilation = { options: { output: { publicPath: 'vendor/' } } };
+ const pluginData = Object.assign({ assets: { js: [], css: [] } }, mock);
+ const injectCallback = jest.fn();
+ const plugin = new AddAssetHtmlPlugin({
+ filepath: path.join(__dirname, 'my-file.js'),
+ inject: injectCallback,
+ });
+
+ await plugin.addAllAssetsToCompilation(compilation, pluginData);
+
+ expect(injectCallback).toHaveBeenCalledWith(mock.plugin);
+ });
+
+ test('does not inject if the callback returns false', async () => {
+ const compilation = { options: { output: { publicPath: 'vendor/' } } };
+ const pluginData = Object.assign(
+ { assets: { js: [], css: [] } },
+ pluginMock,
+ );
+ const plugin = new AddAssetHtmlPlugin({
+ filepath: path.join(__dirname, 'my-file.js'),
+ inject: () => {
+ return false;
+ },
+ });
+
+ await plugin.addAllAssetsToCompilation(compilation, pluginData);
+
+ expect(pluginData.assets.js).toHaveLength(0);
+ });
+
+ test('injects if the callback returns true', async () => {
+ const compilation = { options: { output: { publicPath: 'vendor/' } } };
+ const pluginData = Object.assign(
+ { assets: { js: [], css: [] } },
+ pluginMock,
+ );
+ const plugin = new AddAssetHtmlPlugin({
+ filepath: path.join(__dirname, 'my-file.js'),
+ inject: () => {
+ return true;
+ },
+ });
+
+ await plugin.addAllAssetsToCompilation(compilation, pluginData);
+
+ expect(pluginData.assets.js).toHaveLength(1);
+ });
+});