fix(v5): webpack v5 compatibility

Author: shellscape

lib/helpers.js

@@ -53,25 +53,28 @@ const reduceAssets = (files, asset, moduleAssets) => {
 };
 
 const reduceChunk = (files, chunk, options) =>
-  chunk.files.reduce((prev, path) => {
-    let name = chunk.name ? chunk.name : null;
-    // chunk name, or for nameless chunks, just map the files directly.
-    name = name
-      ? options.useEntryKeys && !path.endsWith('.map')
-        ? name
-        : `${name}.${getFileType(path, options)}`
-      : path;
+  Array.of(...Array.from(chunk.files), ...Array.from(chunk.auxiliaryFiles || [])).reduce(
+    (prev, path) => {
+      let name = chunk.name ? chunk.name : null;
+      // chunk name, or for nameless chunks, just map the files directly.
+      name = name
+        ? options.useEntryKeys && !path.endsWith('.map')
+          ? name
+          : `${name}.${getFileType(path, options)}`
+        : path;
 
-    return prev.concat({
-      path,
-      chunk,
-      name,
-      isInitial: chunk.isOnlyInitial(),
-      isChunk: true,
-      isAsset: false,
-      isModuleAsset: false
-    });
-  }, files);
+      return prev.concat({
+        path,
+        chunk,
+        name,
+        isInitial: chunk.isOnlyInitial(),
+        isChunk: true,
+        isAsset: false,
+        isModuleAsset: false
+      });
+    },
+    files
+  );
 
 const standardizeFilePaths = (file) => {
   const result = Object.assign({}, file);

lib/hooks.js

@@ -2,6 +2,9 @@ const { mkdirSync, writeFileSync } = require('fs');
 const { basename, dirname, join } = require('path');
 
 const { SyncWaterfallHook } = require('tapable');
+const webpack = require('webpack');
+// eslint-disable-next-line global-require
+const { RawSource } = webpack.sources || require('webpack-sources');
 
 const { generateManifest, reduceAssets, reduceChunk, transformFiles } = require('./helpers');
 
@@ -35,15 +38,23 @@ const emitHook = function emit(
 ) {
   const emitCount = emitCountMap.get(manifestFileName) - 1;
   // Disable everything we don't use, add asset info, show cached assets
-  const stats = compilation
-    .getStats()
-    .toJson({ all: false, assets: true, cachedAssets: true, ids: true, publicPath: true });
+  const stats = compilation.getStats().toJson({
+    // all: false,
+    assets: true,
+    cachedAssets: true,
+    ids: true,
+    publicPath: true
+  });
+
   const publicPath = options.publicPath !== null ? options.publicPath : stats.publicPath;
   const { basePath, removeKeyHash } = options;
 
   emitCountMap.set(manifestFileName, emitCount);
 
-  let files = compilation.chunks.reduce((prev, chunk) => reduceChunk(prev, chunk, options), []);
+  let files = Array.from(compilation.chunks).reduce(
+    (prev, chunk) => reduceChunk(prev, chunk, options),
+    []
+  );
 
   // module assets don't show up in assetsByChunkName, we're getting them this way
   files = stats.assets.reduce((prev, asset) => reduceAssets(prev, asset, moduleAssets), files);
@@ -79,17 +90,19 @@ const emitHook = function emit(
 
   if (isLastEmit) {
     const output = options.serialize(manifest);
-
-    Object.assign(compilation.assets, {
-      [manifestAssetId]: {
-        source() {
-          return output;
-        },
-        size() {
-          return output.length;
-        }
-      }
-    });
+    //
+    // Object.assign(compilation.assets, {
+    //   [manifestAssetId]: {
+    //     source() {
+    //       return output;
+    //     },
+    //     size() {
+    //       return output.length;
+    //     }
+    //   }
+    // });
+    //
+    compilation.emitAsset(manifestAssetId, new RawSource(output));
 
     if (options.writeToFileEmit) {
       mkdirSync(dirname(manifestFileName), { recursive: true });
@@ -100,10 +113,17 @@ const emitHook = function emit(
   getCompilerHooks(compiler).afterEmit.call(manifest);
 };
 
-const moduleAssetHook = ({ moduleAssets }, module, file) => {
-  if (module.userRequest) {
-    Object.assign(moduleAssets, { [file]: join(dirname(file), basename(module.userRequest)) });
-  }
+const normalModuleLoaderHook = ({ moduleAssets }, loaderContext, module) => {
+  const { emitFile } = loaderContext;
+
+  // eslint-disable-next-line no-param-reassign
+  loaderContext.emitFile = (file, content, sourceMap) => {
+    if (module.userRequest && !moduleAssets[file]) {
+      Object.assign(moduleAssets, { [file]: join(dirname(file), basename(module.userRequest)) });
+    }
+
+    return emitFile.call(module, file, content, sourceMap);
+  };
 };
 
-module.exports = { beforeRunHook, emitHook, getCompilerHooks, moduleAssetHook };
+module.exports = { beforeRunHook, emitHook, getCompilerHooks, normalModuleLoaderHook };

lib/index.js

@@ -1,6 +1,9 @@
 const { relative, resolve } = require('path');
 
-const { beforeRunHook, emitHook, getCompilerHooks, moduleAssetHook } = require('./hooks');
+const webpack = require('webpack');
+const NormalModule = require('webpack/lib/NormalModule');
+
+const { beforeRunHook, emitHook, getCompilerHooks, normalModuleLoaderHook } = require('./hooks');
 
 const emitCountMap = new Map();
 
@@ -19,6 +22,7 @@ const defaults = {
   },
   sort: null,
   transformExtensions: /^(gz|map)$/i,
+  useEntryKeys: false,
   writeToFileEmit: false
 };
 
@@ -40,16 +44,27 @@ class WebpackManifestPlugin {
       moduleAssets,
       options: this.options
     });
-    const moduleAsset = moduleAssetHook.bind(this, { moduleAssets });
+    const normalModuleLoader = normalModuleLoaderHook.bind(this, { moduleAssets });
     const hookOptions = {
       name: 'WebpackManifestPlugin',
       stage: Infinity
     };
 
     compiler.hooks.compilation.tap(hookOptions, (compilation) => {
-      compilation.hooks.moduleAsset.tap(hookOptions, moduleAsset);
+      const hook = !NormalModule.getCompilationHooks
+        ? compilation.hooks.normalModuleLoader
+        : NormalModule.getCompilationHooks(compilation).loader;
+      hook.tap(hookOptions, normalModuleLoader);
     });
-    compiler.hooks.emit.tap(hookOptions, emit);
+
+    if (webpack.version.startsWith('4')) {
+      compiler.hooks.emit.tap(hookOptions, emit);
+    } else {
+      compiler.hooks.thisCompilation.tap(hookOptions, (compilation) => {
+        compilation.hooks.processAssets.tap(hookOptions, () => emit(compilation));
+      });
+    }
+
     compiler.hooks.run.tap(hookOptions, beforeRun);
     compiler.hooks.watchRun.tap(hookOptions, beforeRun);
   }