webpack - 限制 Webpack 4 中的块数

Question

我正在通过动态导入拆分我的单页应用程序。我希望所有这些都捆绑在一个额外的文件中，而不是主捆绑包。这意味着，我最终会得到类似的东西：

• app.e82eb13a2342391fab679.js - 主包
• 0.c399423423532432c1da433.js - 单个包中的所有代码拆分块

在我的 Webpack 2 配置中，我使用以下配置来完成它：

plugins: [
  new CommonsChunkPlugin({
    names: ['app'],
    children: true,
    async: true,
  }),
  new LimitChunkCountPlugin({
    maxChunks: 3
  }),
]

在 Webpack 4 中，我尝试使用以下配置将额外的块限制为 1：

optimization: {
  splitChunks: {
    chunks: 'async',
    minSize: 100000,
    maxSize: 0,
    minChunks: 1,
    maxAsyncRequests: 1,
    maxInitialRequests: 1,
    automaticNameDelimiter: '~',
    name: true,
    cacheGroups: {
    }
  }
}

但我仍然会得到不需要的额外块：

 2.c99478cc68a70c1da433.js   1.97 MiB       2  [emitted]  [big]  
 3.913a2df562e62d9338e3.js   1.56 MiB       3  [emitted]  [big]  
 4.4acc069c6a8aa5662198.js     48 KiB       4  [emitted]         
 app.e82eb13a526791fab679.js   1.31 MiB     0  [emitted]  [big]  app