Webpack 4和splitChunks-将所有供应商代码移动到单独的块中，动态导入的模块除外

如何解决Webpack 4和splitChunks-将所有供应商代码移动到单独的块中，动态导入的模块除外

我有一个看起来像这样的项目：

• app.js
• module1.js
• node_modules

module1通过import(/* webpackChunkName: 'module1' */ '@path')动态导入到app.js中。

我正在尝试配置splitChunks插件，以便其输出：

1. 包含src代码且没有依赖项和程序包的应用程序块；
2. module1块，其中包括动态导入的模块的源代码和来自node_modules的必需依赖项；
3. 供应商块，其中包括来自node_modules的其余依赖项；

做到这一点的最佳方法是什么？ 该应用程序只有一个条目，即app.js

解决方法

使用以下配置解决了它。密钥是供应商缓存组中的chunks: inital。

  optimization: {
    splitChunks: {
      chunks: 'all',maxInitialRequests: Infinity,minSize: 0,cacheGroups: {
        vendors: false,default: false,vendor: {
          chunks: 'initial',test: /[\\/]node_modules[\\/]/,name: 'vendor',reuseExistingChunk: true
        },},