Webpack 迁移 3 -> 4：错误：找不到模块“webpack/lib/optimize/CommonsChunkPlugin”

我正在尝试从 webpack 3 迁移到 webpack 4。

当我尝试运行 webpack 时，我遇到的问题是 CommonsChunkPlugin (npm run webpack-dev-server -- --config config/webpack.dev.js），我有以下错误：

module.js:529
    throw err;
    ^

Error: Cannot find module 'webpack/lib/optimize/CommonsChunkPlugin'
    at Function.Module._resolveFilename (module.js:527:15)
    at Function.Module._load (module.js:476:23)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/antoinepissot/DEV/Reports/config/webpack.common.js:17:28)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)

是什么导致了这个问题？

我看了看webpack github 上的更改日志 https://github.com/webpack/webpack/releases并发现 CommonsChunkPlugin 已被删除

但当我看到webpack 文档 https://webpack.js.org/plugins/commons-chunk-plugin/，我可以找到 4.1.1 版本的 CommonsChunkPlugin

我的直觉告诉我CommonsChunkPlugin已被弃用，我们应该使用optimization.splitChunks.

有人遇到过这个问题并找到了从版本 3 迁移到版本 4 的好教程吗？

正如 Vardius 在评论中指出的那样，CommonsChunkPlugin 已被删除。

在 webpack 4 中，此行为是使用“优化” https://webpack.js.org/configuration/optimization/webpack 配置根部的字段。

例如，我的 webpack.config.js 现在是这样的：

module.exports = function () {
   return {
    resolve: ...
    module: ...
    plugins: ...
    optimization: {

       namedModules: true, // old NamedModulesPlugin()
       splitChunks: {      // old CommonsChunkPlugin
          chunks: "all"
       },
       runtimeChunk: true,
       concatenateModules: true // old ModuleConcatenationPlugin
    }
}