From 1b59e0944f561b264f11847ef245c9fc3f05b80f Mon Sep 17 00:00:00 2001 From: Jan Nicklas Date: Wed, 14 Oct 2020 17:12:16 +0200 Subject: [PATCH] fix: use new webpack 5 api to extract assets from child compilation --- examples/javascript/dist/webpack-5/index.html | 2 +- lib/child-compiler.js | 56 ++++++++----------- 2 files changed, 25 insertions(+), 33 deletions(-) diff --git a/examples/javascript/dist/webpack-5/index.html b/examples/javascript/dist/webpack-5/index.html index 1e32f3c0..9930f856 100644 --- a/examples/javascript/dist/webpack-5/index.html +++ b/examples/javascript/dist/webpack-5/index.html @@ -1 +1 @@ -Hello World from backend2020-10-14T14:25:45.361Z

Partial

\ No newline at end of file +Hello World from backend2020-10-14T15:07:03.011Z

Partial

\ No newline at end of file diff --git a/lib/child-compiler.js b/lib/child-compiler.js index f9189b93..7cdb0773 100644 --- a/lib/child-compiler.js +++ b/lib/child-compiler.js @@ -16,6 +16,7 @@ const NodeTargetPlugin = require('webpack/lib/node/NodeTargetPlugin'); const LoaderTargetPlugin = require('webpack/lib/LoaderTargetPlugin'); const LibraryTemplatePlugin = require('webpack/lib/LibraryTemplatePlugin'); const SingleEntryPlugin = require('webpack/lib/SingleEntryPlugin'); +const Compilation = require('webpack').Compilation; /** * The HtmlWebpackChildCompiler is a helper to allow reusing one childCompiler @@ -100,17 +101,38 @@ class HtmlWebpackChildCompiler { new LibraryTemplatePlugin('HTML_WEBPACK_PLUGIN_RESULT', 'var').apply(childCompiler); new LoaderTargetPlugin('node').apply(childCompiler); + // Generate output file names + const temporaryTemplateNames = this.templates.map((template, index) => `__child-HtmlWebpackPlugin_${index}-${template}`); + // Add all templates this.templates.forEach((template, index) => { - new SingleEntryPlugin(childCompiler.context, template, `HtmlWebpackPlugin_${index}`).apply(childCompiler); + new SingleEntryPlugin(childCompiler.context, template, `HtmlWebpackPlugin_${index}-${template}`).apply(childCompiler); }); this.compilationStartedTimestamp = new Date().getTime(); this.compilationPromise = new Promise((resolve, reject) => { + const extractedAssets = []; + childCompiler.hooks.compilation.tap('HtmlWebpackPlugin', (compilation) => { + compilation.hooks.processAssets.tap( + { + name: 'HtmlWebpackPlugin', + stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONS + }, + (assets) => { + temporaryTemplateNames.forEach((temporaryTemplateName) => { + if (assets[temporaryTemplateName]) { + extractedAssets.push(assets[temporaryTemplateName]); + compilation.deleteAsset(temporaryTemplateName); + } + }); + } + ); + }); + childCompiler.runAsChild((err, entries, childCompilation) => { // Extract templates const compiledTemplates = entries - ? extractHelperFilesFromCompilation(mainCompilation, childCompilation, outputOptions.filename, entries) + ? extractedAssets.map((asset) => asset.source()) : []; // Extract file dependencies if (entries) { @@ -159,36 +181,6 @@ class HtmlWebpackChildCompiler { } } -/** - * The webpack child compilation will create files as a side effect. - * This function will extract them and clean them up so they won't be written to disk. - * - * Returns the source code of the compiled templates as string - * - * @returns Array - */ -function extractHelperFilesFromCompilation (mainCompilation, childCompilation, filename, childEntryChunks) { - const helperAssetNames = childEntryChunks.map((entryChunk, index) => { - const entryConfig = { - hash: childCompilation.hash, - chunk: entryChunk, - name: `HtmlWebpackPlugin_${index}` - }; - - return mainCompilation.getAssetPath(filename, entryConfig); - }); - - helperAssetNames.forEach((helperFileName) => { - delete mainCompilation.assets[helperFileName]; - }); - - const helperContents = helperAssetNames.map((helperFileName) => { - return childCompilation.assets[helperFileName].source(); - }); - - return helperContents; -} - module.exports = { HtmlWebpackChildCompiler };