Dart Sass 是唯一支持现代 CSS 语法的 Sass 实现——Node Sass 因依赖已弃用的 libsass，无法解析 calc()、@container、color-mix() 等，且 ::v-deep 写法需严格遵循 CSS 规范；迁移只需卸载 node-sass、安装 sass 并确保 sass-loader 指向 Dart Sass。
Dart Sass 不是“推荐用”，而是“不用就编译不过”——Node Sass 已无法解析 calc(100% / 3)、@container、color-mix() 等现代 CSS 语法，连词法层都直接崩溃。
Node Sass 解析 calc() 中的 / 就报错
Node Sass 基于已弃用的 libsass（2020 年底官方终止维护），其解析器把所有 / 都当 Sass 除法运算符处理，哪怕写在 calc() 里：
-
width: calc(100% / 3);→ 报错SassError: Invalid CSS after "100%": expected expression - 加
// sass:disable-next-line无效——错误发生在词法解析阶段，根本没走到“禁用”逻辑 - 你不能靠注释绕过，因为 libsass 压根不识别
calc()是 CSS 原生函数
Dart Sass 能正确识别 @container、color-mix() 等新 CSS 规则
Dart Sass 把 CSS 原生语法交给标准 parser 处理，Sass 扩展逻辑再叠加，所以这些特性能无损透出：
-
@container (min-width: 400px) { .card { ... } }→ Dart Sass 输出合法 CSS；Node Sass 直接报Unknown at rule -
background: color-mix(in srgb, red 50%, blue);→ Dart Sass 支持；Node Sass 完全不认识该 token -
@use "sass:color"和@use "sass:math"提供对相对颜色、hwb()等的完整支持
Vue / React 项目迁移时最常卡在 ::v-deep 写法上
这不是语法糖差异，而是解析规则升级：Dart Sass 严格按 CSS 规范解析伪元素，容错性归零：
用于自动切换项目中适合的node 版本
下载
根据 package.json 中的 engines 字段自动检测 Node.js 版本需求，未安装 nvm 时自动安装并切换至对应版本。支持 Windows、macOS、Linux。适用于 Node.js 项目开发、版本切换和环境配置。
立即学习“前端免费学习笔记（深入）”；
- 错误写法：
::v-deep.foo→ Dart Sass 当成伪类名解析，报Unknown pseudo-class selector "::v-deep.foo" - 正确写法：
::v-deep .foo（注意空格）→ 表示“后代选择器”，样式才能生效 -
/deep/已被完全移除，无法通过 loader 降级兼容；>>>同样失效
迁移只需两步，但工具链配置容易漏掉
看似简单，实操中常因残留旧配置导致构建失败：
- 卸载：
yarn remove node-sass或npm uninstall node-sass - 安装：
yarn add sass -D（注意不是dart-sass，该包早已重定向并弃用） - 检查
sass-loader配置：Vite / Vue CLI 默认已设implementation: require('sass')，但若项目有手动配置指向node-sass，会触发Module build failed: SassError: Invalid CSS after ""
真正难的不是换包，而是意识到：Node Sass 的“兼容”其实是放任错误，而 Dart Sass 的“报错”才是 CSS 规范本该有的样子。一旦项目混用 PostCSS 插件（如 postcss-nesting），Node Sass 输出的未闭合块会直接让后续插件链 crash——这种隐性断裂，比报错更危险。
