Webpack:仅在一个模块中包含供应商

时间:2019-01-15 15:39:15

标签: angularjs webpack

我尝试将我的项目构建之一从browserify迁移到Webpack。这是AngularJS@1.7项目,我有多个捆绑软件: core 与AngularJS及其依赖项导入以及具有特定依赖项的其他特定延迟加载模块。因此,我有多个入口点,但是我只在index.html中加载 core .js脚本。另一个模块在我的解析器路由时解析。

其中一个延迟加载模块导入了AngularJS,它导致重复的代码和WARNING: Tried to load AngularJS more than once。我想进行Webpack检查是否在核心中导入了模块,并从中加载了模块。

1 个答案:

答案 0 :(得分:1)

我成功了,但需要在index.html中导入一个额外的文件common-vendors.js

我的配置:

export default {
    context: path.resolve(__dirname, './src/app'),
//...
    entry: {
        'core': './core/core.module',
        'back-office': './back-office/back-office.module',
        'front-office-1': './front-office-2/front-office-2.module',
        'front-office-2': './front-office-3/front-office-3.module'
    },

    output: {
        filename: '[name].js',
        path: path.resolve(__dirname, 'www')
    },

    mode: config.env,

    optimization: {
        splitChunks: {
            cacheGroups: {
                'common-vendors': {
                    test: /[\\/]node_modules[\\/]/,
                    name: 'common-vendors',
                    chunks: 'initial',
                    minChunks: 2
                }
            }
        },
        runtimeChunk: {name: 'core'},
        minimizer: [
            new UglifyJsPlugin({
                uglifyOptions: {mangle: false}
            })
        ]
    },

    plugins: [
        new CompressionPlugin()
    ]
}

如果您知道更好的解决方案,请随时发表评论。