webpack4.X修改SplitChunksPlugin.vendors.filename报错

报错内容:You are trying to set a filename for a chunk which is (also) loaded on demand. The runtime can only handle loading of chunks which match the chunkFilename schema. Using a custom filename would fail at runtime. (cache group: defaultVendors)
module.exports = {
    // 此处省略其他配置项
    ...
    optimization: {
        splitChunks: {
            chunks: 'all',
            minSize: 30000,
            //minRemainingSize: 0,
            maxSize: 0,
            minChunks: 1,
            maxAsyncRequests: 6,
            maxInitialRequests: 4,
            automaticNameDelimiter: '~',
            // 下面两个属性如果设置成两个false,打包后就不会出现verndors~前缀
            // cacheGroups: {
            //     vendors: false,
            //     default: false
            // }
            cacheGroups: {
                vendors: {
                    test: /[\\/]node_modules[\\/]/,
                    priority: -10
                    //filename: 'vendors'
                },
                default: {
                    //minChunks: 2,
                    priority: -20,
                    reuseExistingChunk: true
                    //filename: 'common'
                }
            }
        }
    }
    ...
}
  • 解决办法:注释掉filename
  • 原因在文档中有:

webpack4.X修改SplitChunksPlugin.vendors.filename报错_第1张图片
缓存组设置filename时,在chunks项配置为inital时才会生效,我们分割同步代码时,可以设置chunk为inital,这样就可以自定义filename了。否则会报错。

  • chunks设置成inital,我理解的是非异步模块

webpack4.X修改SplitChunksPlugin.vendors.filename报错_第2张图片

你可能感兴趣的:(webpack4)