关于webpack:webpack体积怎么优化有哪些方法

46次阅读

共计 427 个字符,预计需要花费 2 分钟才能阅读完成。

1) 去掉不必要的插件

开发环境和生产环境应用同一个 webpack 配置文件,导致生产环境打包的 js 文件蕴含很多没必要的插件 (如:NoEmitOnErrorsPlugin)

2) 提取第三方库

第三方库和源代码在一起打包体积会很大

CommonsChunkPlugin 提取代码中公共模块,而后将公共模块打包到一个独立的文件中,以便在其余的入口和模块中应用。

3) 代码压缩

内置插件 UglifyPlugin, 退出这个插件编译速度会变慢,所以个别只在生产环境启用

4) 代码宰割 (webpack 的 code split 配合 router)

·webpack 的 code spliting 个性能够将代码库宰割成按需加载的块 (chunks)

·AMD/commmonJS 指定不同的办法去做代码按需加载,他们反对代码宰割并充当宰割点

·不反对 es6 的模块零碎

5) 设置缓存

对于动态文件,第一次获取之后,文件内容没有扭转的话间接读取缓存,然而如果缓存工夫过长文件要更新的话能够打包后的文件名退出 hash 值。

正文完
 0