前端 | Vue-cli3 中如何将 node-sass 替换为 dart-sass | Vue

前端 | Vue-cli3 中如何将 node-sass 替换为 dart-sass | Vue

前言

这里选择使用dart-sass还有一个更主要的原因，sass官方已经将dart-sass作为未来主要的的开发方向了，有任何新功能它都是会优先支持的，而且它已经在社区里稳定运行了很长的一段时间，基本没有什么坑了。dart-sass之所以容易安装，主要是因为它会被编译成纯js，这样就可以直接在的 node 环境中使用。虽然这样它的运行速度会比基于 libsass 的慢一些些，但这些速度的差异几乎可以忽略不计。整个社区现在都在拥抱dart-sass，我们没有理由拒绝！而且它的确大大简化了用户的安装成本。

目前vue-cli在选择sass预处理的时候也会默认优先使用dart-scss，相关 pr

相关的说明可以见该篇文章： Announcing Dart Sass

具体 dart-sass性能评测可见：Perf Report

快速使用

替换也非常的简单，只需要几个步骤

1. 卸载 node-sass

 npm uninstall node-sass
 
 yarn remove node-sass

2. 安装 dart-sass

 npm install --dev sass

 yarn add sass