fix: support loaders like raw-loader

Author: jantimon

index.js

@@ -123,7 +123,9 @@ class HtmlWebpackPlugin {
  }
  // The LibraryTemplatePlugin stores the template result in a local variable.
  // To extract the result during the evaluation this part has to be removed.
- source = source.replace('var HTML_WEBPACK_PLUGIN_RESULT =', '');
+ if (source && source.indexOf('HTML_WEBPACK_PLUGIN_RESULT') >= 0) {
+ source += ';\nHTML_WEBPACK_PLUGIN_RESULT';
+ }
  const templateWithoutLoaders = templateFilename.replace(/^.+!/, '').replace(/\?.+$/, '');
  const vmContext = vm.createContext({ HTML_WEBPACK_PLUGIN: true, require: require, ...global });
  const vmScript = new vm.Script(source, { filename: templateWithoutLoaders });

lib/child-compiler.js

@@ -75,7 +75,6 @@ class HtmlWebpackChildCompiler {
  const webpack = mainCompilation.compiler.webpack;
  const Compilation = webpack.Compilation;
 
- const NodeTemplatePlugin = webpack.node.NodeTemplatePlugin;
  const NodeTargetPlugin = webpack.node.NodeTargetPlugin;
  const LoaderTargetPlugin = webpack.LoaderTargetPlugin;
  const EntryPlugin = webpack.EntryPlugin;
@@ -95,18 +94,17 @@ class HtmlWebpackChildCompiler {
  name: 'HTML_WEBPACK_PLUGIN_RESULT'
  },
  /** @type {'text/javascript'} */
- scriptType: (/** @type {'text/javascript'} */'text/javascript'),
- iife: false
+ scriptType: (/** @type {'text/javascript'} */'text/javascript')
  };
  const compilerName = 'HtmlWebpackCompiler';
  // Create an additional child compiler which takes the template
  // and turns it into an Node.JS html factory.
  // This allows us to use loaders during the compilation
  const childCompiler = mainCompilation.createChildCompiler(compilerName, outputOptions, [
  // Compile the template to nodejs javascript
- new NodeTemplatePlugin(outputOptions),
  new NodeTargetPlugin(),
- new LoaderTargetPlugin('node')
+ new LoaderTargetPlugin('node'),
+ new webpack.library.EnableLibraryPlugin('var')
  ]);
  // The file path context which webpack uses to resolve all relative files to
  childCompiler.context = mainCompilation.compiler.context;

package.json

@@ -41,12 +41,13 @@
  "mini-css-extract-plugin": "1.0.0",
  "pug": "2.0.3",
  "pug-loader": "2.4.0",
+ "raw-loader": "4.0.2",
  "rimraf": "2.6.3",
  "semistandard": "^13.0.1",
  "standard-version": "9.0.0",
  "style-loader": "0.23.1",
  "typescript": "4.0.5",
- "webpack": "5.4.0",
+ "webpack": "5.10.0",
  "webpack-recompilation-simulator": "3.2.0"
  },
  "dependencies": {

spec/basic.spec.js

@@ -519,6 +519,26 @@ describe('HtmlWebpackPlugin', () => {
  }, ['<link href="styles.css" rel="stylesheet">'], null, done);
  });
 
+ it('works with a javascript returning loader like raw-loader', done => {
+ testHtmlPlugin({
+ mode: 'production',
+ entry: path.join(__dirname, 'fixtures/index.js'),
+ module: {
+ rules: [
+ { test: /\.html$/, use: ['raw-loader'] }
+ ]
+ },
+ output: {
+ path: OUTPUT_DIR,
+ filename: '[name].js'
+ },
+ plugins: [new HtmlWebpackPlugin({
+ inject: true,
+ template: path.join(__dirname, 'fixtures/plain.html')
+ })]
+ }, ['<script defer="defer" src="main.js"', '<title>Example Plain file</title>'], null, done);
+ });
+
  it('should work with the css extract plugin on windows and protocol relative urls support (#205)', done => {
  testHtmlPlugin({
  mode: 'production',