升级到 Webpack 5 后无法访问 copy-webpack-plugin 中的菜单

Question

4.6.0我的配置在 webpack 版本和 webpack-assets-manifest 版本中运行良好3.1.1

自从我升级到 webpack5和 webpack-assets-manifest 到5. 我没有从我的东西中获得价值，manifestObject它只是一个空物体

我怀疑发生这种情况是因为在创建清单之前运行的转换函数查看了 webpack-assets-manifest 的新文档，但无法使其工作

我的目标是访问转换函数中的清单值，但看起来转换函数在生成清单之前正在运行

var CopyWebpackPlugin = require('copy-webpack-plugin');
var SaveHashes = require('webpack-assets-manifest');

const manifest = new SaveHashes({
    entrypoints: true,
    entrypointsKey: 'entryPoints'
});
module.exports = {
    entry: {
        main: ['./src/apps/main'],
        games: ['./src/apps/games'],
    },
    output: {
        path: path.join(__dirname, 'dist'),
        publicPath: assetsUrl,
        filename: 'assets/javascript/[name].[contenthash].js',
        chunkFilename: 'assets/javascript/[name].[contenthash].js'
    },
    .
    .
    .
    .
    .
    plugins: [
        new CleanWebpackPlugin(),
        manifest,
        new CopyWebpackPlugin([
            {
                from: './views/**/*',
                to: path.join(__dirname, 'dist'),
                transform(content, path) {
                    // I want to access manifest here
                    // so that I can inject the final script(javascript bundle with content hash)
                    // in my view template
                    const manifestObject = JSON.parse(manifest);
                }
            }
        ])
    ]
};

Answer 1

你需要像这样导出它

const ManifestPlugin = require("webpack-manifest-plugin").WebpackManifestPlugin;

.....
  new ManifestPlugin({
            fileName: "asset-manifest.json",
            publicPath: paths.publicUrlOrPath,
            generate: (seed, files, entrypoints) => {
                const manifestFiles = files.reduce((manifest, file) => {
                    manifest[ file.name ] = file.path;

                    return manifest;
                }, seed);
                const entrypointFiles = entrypoints.main.filter(
                    (fileName) => !fileName.endsWith(".map")
                );

                return {
                    files: manifestFiles,
                    entrypoints: entrypointFiles,
                };
            },
        }),

它会起作用，WebpackManifestPlugin这就是你所需要的