弃用 Node Sass 以 Dart Sass 代替
2020年10月26日,Sass 官方团队正式宣布 Libsass 将弃用,以及基于它的 Node Sass 和 SassC,并且建议用户使用 Dart Sass。
背景说明
此次改动是在 Sass 核心团队进行了大量讨论之后,得出的结论,现在是时候正式宣布弃用 LibSass 和基于它构建的包(包括 Node Sass)。多年来,LibSass 显然没有足够的工程带宽来跟上 Sass 语言的最新发展 (例如,最近的语言特性是在 2018 年 11 月添加的)。尽管我们非常希望看到这种情况有所改善,但即使 LibSass 长期贡献者 Michael Mifsud 和 Marcel Greter 的出色工作也无法跟上 CSS 和 Sass 语言开发的快速步伐。
主要包括以下四点说明:
- 不再建议将 LibSass 用于新的 Sass 项目, 改为使用 Dart Sass。
- 建议所有现有的 LibSass 用户制定计划,最终迁移到 Dart Sass,并且所有 Sass 库都制定计划 最终放弃对 LibSass 的支持。
- 不再计划向 LibSass 添加任何新功能,包括与新 CSS 功能的兼容性。
- LibSass 和 Node Sass 将在尽力而为的基础上无限期维护,包括修复主要的错误和安全问题以及与最新的 Node 版本兼容。
为什么弃用?
几年来,Sass 一直处于一种模棱两可的状态,LibSass 在理论上是官方支持实现,但实际上从它的功能表现来看是静止的。 随着时间的流逝,越来越清楚感受到这种状态对 Sass 用户已经造成了切实的问题。 例如,经常让用户感到困惑,为什么原生 CSS 的 min() 和 max() 无法正常工作,可能会认为 Sass 整体存在问题,但是实际上是因为 LibSass 不支持该功能。
官方支持的 LibSass 不仅会给个别用户带来痛苦,由于 LibSass 不支持去年启动的 Sass 模块系统,主要相关的 Sass 库由于担心其下游用户不兼容而无法使用它, 明确指出所有 Sass 用户应该放弃使用 LibSass,我们希望使这些 library 的作者能够更加切实地使用更多现代的功能特性。
LibSass 甚至抑制了 Sass 语言本身的发展。 我们无法继续推进有关 treating / as a separator 的提议,因为他们编写的任何代码都会在 Dart Sass 中产生弃用警告或无法在 LibSass 中编译。 通过将 LibSass 标记为已弃用,情况会变得更好,并且 Sass 在支持最新版本的 CSS 方面会变得更好。
Node Sass 与 Dart Sass 区别
- node-sass 是用 node(调用 cpp 编写的 libsass)来编译 sass;
- dart-sass 是用 drat VM 来编译 sass;
- node-sass是自动编译实时的,dart-sass需要保存后才会生效;
- 推荐 dart-sass 性能更好(也是 sass 官方使用的);
不替换会有哪些问题?
node-sass
因为国情问题经常装不上,淘宝的NPM镜像中,也在逐步取消支持;- 魔方组件已全部替换为
dart-sass
,如果不替换,在项目中改变 SCSS 变量可能会引起代码报错,原因是使用了新的math
方法; - 官方已经不在支持
node-sass
,后续精力都会投入到dart-sass
上,问题不再修复;
综上所述,建议还是逐步替换!
如何替换?
其实替换 node-sass
和把大象装进冰箱一样,只需要三步即可完成:
1. 卸载 node-sass
npm uninstall node-sass
2. 安装 dart-sass
npm install sass sass-loader -D
3. 全局替换 deep
如果项目之前用到/deep/
需要替换为::v-deep
,全局搜索 /deep/
, 将项目里的 /deep/
替换为 ::v-deep
;
补充
一些老的项目,如果不想替换,暂时可以使用淘宝的sass镜像处理。
项目根目录新建 .nmprc
文件,内容如下:
sass_binary_site=https://registry.npmmirror.com/-/binary/node-sass
到这里,还需要配合 node-sass
版本才能下载成功。
例如一开始我项目上面使用的是4.12.0的版本,安装的时候报错:
然后就去镜像里面找找看,看看有没有 win32-x64-83_binding.node
,如果没有,那就得找某个版本有 win32-x64-83_binding.node
的。
后面发现 4.14.0 这个版本里面是有的,那就手动换一下 node-sass
版本。
夏天快乐,感谢博主的分享,支持了。