optimization总结
minimize
默认为true
,效果就是压缩js代码。
minimizer
可以自定义UglifyJsPlugin
和一些配置,默认的压缩为uglifyjs-webpack-plugin
//比如在构建的时候,希望新增css的压缩 minimizer: mode === "development" ? [] : [ new UglifyJsPlugin({ cache: true, parallel: true, sourceMap: mode === "development" }), new OptimizeCSSAssetsPlugin() ]
runtimeChunk
默认为false
,runtime
相关的代码(各个模块之间的引用和加载的逻辑)内嵌入每个entry
。
true
:对于每个entry
会生成runtime~${entrypoint.name}
的文件。
'single'
: 会生成一个唯一单独的runtime.js
文件,就是manifest
。
multiple
:和true
一致。name:{}
:自定义runtime
文件的name
noEmitOnErrors
默认为true
,编译错误的时候是否不生成资源。
namedModules,namedChunks
development
默认都为true
,production
默认为false
,选择是否给module
和chunk
更有意义的名称。
nameModules:true
这里会显示路径
nameModules:false
直接采用索引自增
namedChunks:true
namedChunks:false
采用索引
moduleIds
一般不建议配置namedModules
,namedChunks
针对module
的配置,这里会取hashed
。
针对chunk
的配置,特别是异步代码
一般会采用@vue-cli3
推荐的插件
removeAvailableModules,removeEmptyChunks,mergeDuplicateChunks,flagIncludedChunks