Vue：Node Sass VS. Dart Sass

一、我为什么要换Dart-Sass： 我node版本升级后发现node-sass不支持了，于是我启动了心动已久的计划，卸载Node Sass 投奔Dart Sass。 报错如图： 二、主流的声音怎么说： 在v4.3.0之前本项目都是基于node-sass进行构建的，但node-sass底层依赖libsass，导致很多用户安装的特别的困难，尤其是 windows 用户，它强制用户在windows环境中必须安装python2和Visual Studio才能编译成功。 所以为了解决这个问题，..

node-sass升级dart-sass常见问题及改进方法

dart-sass与node-sass sass 官方目前主力推dart-sass 最新的特性都会在这个上面先实现.。 sass-lang官方网站： https://sass-lang.com/dart-sass 相同 都是用来将sass编译成css的工具。 区别 node-sass 是用 node(调用 cpp 编写的 libsass)来编译 sass； dart-sass 是用 drat VM 来编译 sass； node-sass是自动编译实时的，dart-sass需要保存后才会生效 推荐 dart

安装dart-sas sass-loader 推荐安装sass@1.26.2 sass-loader@7.3.1。更换原因：node-sass经常会出现node版本问题，就很麻烦。卸载项目中的node-sass sass-loader。如果使用了stylelint，需要修改配置规则。然后需要全局替换一下/deep/，全局搜索。从新配置vue.config.js。

相同点 都是用来将sass编译成css的工具。 区别 * node-sass 是用 node(调用 cpp 编写的 libsass)来编译 sass； dart-sass 是用 drat VM 来编译 sass； * node-sass是自动编译实时的，dart-sass需要保存后才会生效 推荐 dart-sass 性能更好（也是 sass 官方使用的），而且 node-sass 因为国情问题经常装不上 基于 libsass 的 node-sass 将被弃用，官方建议改用

vue-cli 3中dart-sass替换node-sass 在使用 node-sass 过程中我们经常会遇到很多问题，不同平台上有各种各样的问题，python版本的问题，node-gyp的问题，node.js的版本问题等等，甚至因为国内网络的问题等等，所以官方现在推荐用dart-sass来作为编译器，在实际操作中发现dart-sass基本没什么坑 ，但是因为项目用的是vue-cli3初始化的vue项目，选用了node-sass，导致不管是部署还是多人开发都遇到了多多少少的问题； 下面是官方的一段话：

一旦你更新了所有相关的配置和依赖项，并且确认你的项目中的所有文件都使用正确的扩展名和语法，这个问题应该就会得到解决。在迁移后，确保彻底测试你的项目以确保一切正常工作。确保你的文件和 webpack 配置中的 loader 规则正确匹配了正确的文件扩展名。文件，确保它们的扩展名正确，并且 webpack 配置中的 loader 规则也相应地设置为处理。相似的 API，但使用的是 Dart Sass，这是一个更现代、更活跃维护的 Sass 实现。为了解决这个问题，你应该按照错误信息的建议，将你的项目从。

dart-sass 和 node-sass都是用来将sass编译成css的工具，所以都依赖sass-loader。但node-sass 与 Node.js 版本相关联，这就导致，一旦本地 Node.js 升级，就会出现 node-sass 无法工作的情况

Dart Sass 是Sass 的主要实现版本，这意味着它集成新功能要早于任何其它的实现版本。 Dart Sass 速度快、易于安装，并且可以被编译成纯JavaScript 代码，这使得它很容易集成到

Sass(Syntactically Awesome Style Sheets) ,是一种css预处理器和一种语言, 它可以用来定义一套新的语法规则和函数，以加强和提升CSS. 它有很多很好的特性，但是它有类似Ruby的语法，没有花括号，没有分号，遵循严格的缩进 它在书写规则，变量命名方面和CSS代码有着很大的区别。于是，后来官方在2010年推出了一个全新的语法，叫做SCSS, 意思是 Sassy...

node-sass很难安装, 经常安装失败, 安装报错, 解决方案, 替代方案如下 亲测有效 , 按这个我从一个老的Vue2的项目中去掉了node-sass

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

sass是一门css预处理器语言 node-sass是帮助nodejs这个平台，连接libSass（用来编译sass语言的预处理器） sass-loader在实现安装了node-sass的基础上，使用webpack时，将sass这门语言写的样式文件，编译成css文件

2020 年 10 月 27 日，Sass 官方团队正式宣布 Libsass 将弃用，以及基于它的 Node Sass 和 SassC，并且建议用户使用 Dart Sass。如果在 vue 脚手架搭建的项目中需要使用 sass，建议初始化时勾选 sass 配置，自行安装，选择默认的就是 dart-sass。dart-sass 替代 node-sass 根本原因：node-sass 无法下载特定版本的二进制依赖文件（博主没有深入研究）dart-sass 使用前需要注意几点：