解决Vue-cli3.0下scss文件编译过慢、卡顿问题

在使用Vue-cli 3.0构建的项目中,可能存在项目编译过慢的问题,具体表现在编译时会在某一进度比如40%时停顿,等好一会儿才能够编译完成。这使得浏览器中的实时预览也会卡顿,不利于我们快速查看效果,大大降低了我们的开发速度,即便是只修改了一个字。

经本人测试,容易导致该问题的一种常见原因是:

scss文件的嵌套导致。

解决方案是:

在main.js文件中分别引入多个scss样式文件,避免将多个scss文件合并后引入。

举例:

我们把reset.scss、custom.scss、variable.scss三个样式文件使用@import语句引入了app.scss,最后在main.js中引入了app.scss。

这时出现编译卡顿情况,可以改为:

在main.js中使用三条import语句分别引入reset.scss、custom.scss、variable.scss三个样式文件。

另外:本人推测,修改vue-cli3.0的loader配置,有可能也能解决问题。若各位有更好的方法,欢迎指出。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值