Переход на Webpack 4: замена CommonsChunkPlugin

Эту проблему мне удалось решить не сразу, но ключевое осознание заключалось в том, что параметр chunks в webpack 4 теперь принимает функцию, что позволяет включать только конкретную точку входа. Предполагаю, что это недавнее изменение, поскольку на момент публикации его не было в официальной документации.

splitChunks: {
  cacheGroups: {
    vendor: {
      name: 'vendor',
      chunks: chunk => chunk.name == 'main',
      reuseExistingChunk: true,
      priority: 1,
      test: module =>
        /[\\/]node_modules[\\/]/.test(module.context),
      minChunks: 1,
      minSize: 0,
    },
  },
},

Если у вас есть какие-то вопросы по этому коду или его настройке, не стесняйтесь спрашивать!

Пожалуйста, обратите внимание, что я исправил проблему, изменив настройки в файле webpack.common.js следующим образом:

Сначала у меня был старый код:

  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      name: ['vendor']
    })
  ]

Теперь я изменил его на:

  optimization: {
      runtimeChunk: "single", // включаем "runtime" чанк
      splitChunks: {
          cacheGroups: {
              vendor: {
                  test: /[\\/]node_modules[\\/]/,
                  name: "vendor",
                  chunks: "all"
              }
          }
      }
  },

Эти изменения позволяют эффективно разделять код и оптимизировать загрузку модулей, так что вы можете использовать их, если столкнетесь с подобной проблемой.