Use Chunks.groupsIterable and filter by instanceof Entrypoint instead
webpack.optimize.CommonsChunkPlugin 已经被移除,现用 optimization.splitChunks来替代。
- 将以前的 webpack.optimize.CommonsChunkPlugin 从plugins中去掉。
- 添加如下代码:
webpackConfig.optimization = {
splitChunks: {
cacheGroups: {
commons: {
chunks: 'initial',
minChunks: 2, maxInitialRequests: 5,
minSize: 0
},
vendor: {
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
priority: 10,
enforce: true
}
}
},
runtimeChunk: true
}
exports = webpackConfig
现在官网还没有文档,大概看下源码的配置
{
"description": "Assign modules to a cache group (modules from different cache groups are tried to keep in separate chunks)",
"type": "object",
"additionalProperties": {
"description": "Configuration for a cache group",
"anyOf": [{
"enum": [
false
]
},
{
"instanceof": "Function"
},
{
"type": "string"
},
{
"instanceof": "RegExp"
},
{
"type": "object",
"additionalProperties": false,
"properties": {
"test": {
"description": "Assign modules to a cache group",
"oneOf": [{
"instanceof": "Function"
},
{
"type": "string"
},
{
"instanceof": "RegExp"
}
]
},
"chunks": {
"description": "Select chunks for determining cache group content (defaults to \"initial\", \"initial\" and \"all\" requires adding these chunks to the HTML)",
"enum": [
"initial",
"async",
"all"
]
},
"enforce": {
"description": "Ignore minimum size, minimum chunks and maximum requests and always create chunks for this cache group",
"type": "boolean"
},
"priority": {
"description": "Priority of this cache group",
"type": "number"
},
"minSize": {
"description": "Minimal size for the created chunk",
"type": "number",
"minimum": 0
},
"minChunks": {
"description": "Minimum number of times a module has to be duplicated until it's considered for splitting",
"type": "number",
"minimum": 1
},
"maxAsyncRequests": {
"description": "Maximum number of requests which are accepted for on-demand loading",
"type": "number",
"minimum": 1
},
"maxInitialRequests": {
"description": "Maximum number of initial chunks which are accepted for an entry point",
"type": "number",
"minimum": 1
},
"reuseExistingChunk": {
"description": "Try to reuse existing chunk (with name) when it has matching modules",
"type": "boolean"
},
"name": {
"description": "Give chunks for this cache group a name (chunks with equal name are merged)",
"oneOf": [{
"type": "boolean"
},
{
"instanceof": "Function"
},
{
"type": "string"
}
]
},
"filename": {
"description": "Sets the template for the filename for created chunks (Only works for initial chunks)",
"type": "string",
"minLength": 1
}
}
}
]
}
}
this.set("optimization.splitChunks", {});
this.set("optimization.splitChunks.chunks", "async");
this.set("optimization.splitChunks.minSize", 30000);
this.set("optimization.splitChunks.minChunks", 1);
this.set("optimization.splitChunks.maxAsyncRequests", 5);
this.set("optimization.splitChunks.maxInitialRequests", 3);
this.set("optimization.splitChunks.name", true);
this.set("optimization.splitChunks.cacheGroups", {});
this.set("optimization.splitChunks.cacheGroups.default", {
reuseExistingChunk: true,
minChunks: 2,
priority: -20
});
this.set("optimization.splitChunks.cacheGroups.vendors", {
test: /[\\/]node_modules[\\/]/,
priority: -10
});