webpack5手动搭建vuecli
发表于: 2021-05-16 23:41:14
简介: 暂无~
webpack5搭建vuecli
话不多说,先上最终打包结果对比图:
原本使用vue脚手架写的项目,在没做优化的情况下,最终的打包结果:
段落引用使用webpack5自己手动搭建的vue脚手架,且做了代码优化后的最终打包结果:
做了什么优化?
- 使用compression-webpack-plugin进行http压缩
- 使用@vue/preload-webpack-plugin进行预获取/预加载
- 使用terser-webpack-plugin进行压缩、转化/混淆
- 使用webpack.optimize.ModuleConcatenationPlugin()进行作用域提升
使用purgecss-webpack-plugin进行css TreeShaking,有bug暂时不做优化- optimization中配置usedExports为true,来帮助Terser进行优化;package.json中配置sideEffects,直接对模块进行优化;
- 使用cdn进行加载需要用到的第三方库
最后更新于:2021-05-16 23:41:14
欢迎评论留言~
0/400
支持markdownComments | 0 条留言
登录
按时间
按热度
目前还没有人留言~