webpack4.0-code Splitting的配置-08

webpack.config.js中
    
    optimization: {
        chunkIds: 'named',
        splitChunks: {
            chunks: 'all', // async 对异步代码进行分割 all可对同步和异步代码进行分割，使用all时，必须配置cacheGroups
            minSize: 30000, // 代码大于30000个字节才做代码分割
            maxSize: 0,
            minChunks: 1, // 一个模块至少被用了多少次进行分割
            maxAsyncRequests: 6,
            maxInitialRequests: 4,
            automaticNameDelimiter: '~',
            automaticNameMaxLength: 30,
            name: true,
            cacheGroups: { // 与chunks配合使用
              vendors: {
                test: /[\\/]node_modules[\\/]/, // 是从node_modules中引入的模块
                priority: -10, // 用来确定切割时生成块的优先级 值越大，优先级越高
                filename: 'vendors.js' // 定义thunk生成后的名称
              },
              default: { // 当未满足minSize的时候，默认thunk的生成
                filename: 'common.js', // 定义thunk生成后的名称
                priority: -20, // 用来确定切割时生成块的优先级 值越大，优先级越高
                reuseExistingChunk: true // 如果之前的块里面有，那就使用之前块里面的方法
              }
            }
        }
    }