在 webpack 运行时代码中添加模块，因为它们是所有入口点所需要的

Question

我有某些模块，例如 Modernizr，我想将其放在 webpack 的 'runtime' 文件中，因为尽快加载它们很重要。但是，我似乎无法弄清楚如何添加这样的模块，因为 Webpack 每次都会将它们放入单独的资产中。有没有办法将某些模块添加到 runtime.js 文件中？

几个小时后，我得到了以下文件，但是，如何将模块添加到 runtime.js 文件中对我来说仍然是个谜。

const path = require('path');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
    mode: "production",
    entry: {
        vendor: './js/vendor.js',
        global: './js/global.js',
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].[chunkhash].js',
    },
    resolve: {
        alias: {
            $: "jquery/src/jquery",
        }
    },
    optimization: {
        runtimeChunk: 'single',
        splitChunks: {
            chunks: 'all'
        },
        minimizer: [new UglifyJsPlugin({
            sourceMap: true,
            extractComments: '/@extract/i',
            parallel: 6
        })]
    },
    module: {
        rules: [{
            test: /\.js$/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ['@babel/preset-env']
                }
            },
        }]
    }
};

感谢您的帮助。

Answer 1

您可以只使用 'runtime' 条目将内容添加到运行时块中。

在 webpack 运行时代码中添加模块，因为它们是所有入口点所需要的

Add modules in webpack runtime code as they are required by all entry points

webpack

webpack-4