问题: 之前的版本是vite3,有个比较严重的问题是打包时耗时超过2分钟,并且是在性能很高的mac pro M1的表现。 记录打包时间的命令:"build": "time vite build",
另外还有个问题是在一些设备上打包会报错内存不足。
因为项目比较庞大,引入的库比较多,排查了很长时间并没有找到行之有效的优化方法。vite已经升级到5了,尝试着做了脚手架的版本升级,过程很顺利,结果也很好,打包时间减少了一半。
前置条件:node版本升级到18或者20.推荐使用nvm管理node版本。
改动: 我的项目是vue3,主要更改的packge.json的以下三个包:
`"vite": "^5.0.0",
"@vitejs/plugin-vue": "^4.5.0",
"@vitejs/plugin-vue-jsx": "^3.1.0",`
参考文档主要是vite官方文档的迁移,变更内容不多,我的项目中只修改了两个地方:
import.meta.globEager:使用import.meta.glob('*', { eager: true })来代替- packge.json中设置了
"type": "module",如果有js文件使用了cjs,会输出错误信息,修改后缀名为.cjs即可。
结果: 优化后的打包时长,内存溢出问题也被解决。