其實這個問題我已經解決得差不多了，沒有想到還有人關注了該問題，是以我将我的方法寫出來供大家參考，其實是用chainWebpack的方式來處理。
//umirc.js[ts]
chainWebpack(config){
config.merge({
optimization: {
minimize: true,
splitChunks: {
chunks: 'async',
minSize: 30000,
minChunks: 2,
automaticNameDelimiter: '.',
cacheGroups: {
vendor: {
name: 'vendors',
test: /^.*node_modules[\\/](?!ag-grid-|lodash|wangeditor|react-virtualized|rc-select|rc-drawer|rc-time-picker|rc-tree|rc-table|rc-calendar|antd).*$/,
chunks: "all",
priority: 10,
},
virtualized: {
name: "virtualized",
test: /[\\/]node_modules[\\/]react-virtualized/,
chunks: "all",
priority: 10
},
rcselect: {
name: "rc-select",
test: /[\\/]node_modules[\\/]rc-select/,
chunks: "all",
priority: 10
},
rcdrawer: {
name: "rcdrawer",
test: /[\\/]node_modules[\\/]rc-drawer/,
chunks: "all",
priority: 10
},
rctimepicker: {
name: "rctimepicker",
test: /[\\/]node_modules[\\/]rc-time-picker/,
chunks: "all",
priority: 10
},
ag: {
name: "ag",
test: /[\\/]node_modules[\\/]ag-grid-/,
chunks: "all",
priority: 10
},
antd: {
name: "antd",
test: /[\\/]node_modules[\\/]antd[\\/]/,
chunks: "all",
priority: 9
},
rctree: {
name: "rctree",
test: /[\\/]node_modules[\\/]rc-tree/,
chunks: "all",
priority: -1
},
rccalendar: {
name: "rccalendar",
test: /[\\/]node_modules[\\/]rc-calendar[\\/]/,
chunks: "all",
priority: -1
},
rctable: {
name: "rctable",
test: /[\\/]node_modules[\\/]rc-table[\\/]es[\\/]/,
chunks: "all",
priority: -1
},
wang: {
name: "wang",
test: /[\\/]node_modules[\\/]wangeditor[\\/]/,
chunks: "all",
priority: -1
},
lodash: {
name: "lodash",
test: /[\\/]node_modules[\\/]lodash[\\/]/,
chunks: "all",
priority: -2
}
}
}
}
});
//過濾掉momnet的那些不使用的國際化檔案
config.plugin("replace").use(require("webpack").ContextReplacementPlugin).tap(() => {
return [/moment[/\\]locale$/, /zh-cn/];
});
}
其中一些依賴是在打包時根據環境變量ANALYZE=1來分析哪些元件被打包到vendors檔案中了，然後通過拆分來減少vendors檔案的大小，特别是moment會将所有的國際化檔案都打包進去，是以通過replacePlugin來過濾掉不使用的國際化檔案