关于优化前端vue项目的思考

背景：前端项目  125M

启动时间5-10分钟

F12会出现崩溃

原因：打包出来的css样式文件体积过大

解决办法：

　　1.启动太久，将vue-cli升级到版本5，能优化不少的时间

　　2.vue.config.js优化

　　　　原先的是将main.scss，放到了前端 css预处理里面，相当于每个文件都引入，其实发现这样增加了很多的体积

　　　　个人理解：loaderOpitons里面适合加上css变量的文件，不适合添加静态的样式，自己测试过，在这里引入一个静态的样式文件，F12检测的时候会出现多份样式

　　　　解决办法：

　　　　　　1.将静态的css抽离出来，在main.js里面引入

　　　　　　2.将带有变量的scss放到预处理里面进行引入，例如 theme.scss

　　　　　　这样下来由原来的120M的体积优化到了90M

　　　　　　3.再将页面中重复引入的theme.scss和common.scsc删掉

　　　　　　这样下来，体积没有减少多少，但是在打包速度这一块也优化了大概10秒钟的时间