必须使用dart sass，因node-sass已停止更新，无法解析calc()中的/、color-mix()、@container等现代css语法，而dart sass严格遵循css规范分层解析，是当前唯一能正确编译的实现。
因为 Node-Sass 已彻底停止演进，而 Dart Sass 是当前唯一能正确解析和输出现代 CSS 语法的实现——不是“推荐用”，是“不用它就编译不过”。
Node-Sass 解析 calc() 中的 / 就报错
Node-Sass 仍把 calc(100% / 3) 里的 / 当作 Sass 除法运算符处理，导致编译失败或生成错误 CSS。它底层依赖的 libsass 在 2020 年底已被官方弃用，语法解析器从未更新。
Dart Sass 则严格按 CSS 规范分层：仅在 calc()、min()、max() 等函数内将 / 视为除法；其他上下文（如 $width / 2）需显式调用 math.div($width, 2)。
- 旧写法
width: $container-width / 3;在 Dart Sass 中仍有效（Sass 语义） - 新写法
width: calc(100% / 3);在 Dart Sass 中能原样透出（CSS 语义） - Node-Sass 对二者都可能误判，尤其在混合使用时直接抛
SassError: Invalid CSS after "": expected 1 selector or at-rule
Dart Sass 能识别 color-mix()、@container 等 CSS 新规则
Node-Sass 遇到 color-mix(in srgb, red 50%, blue) 或 @container (min-width: 400px) { ... } 会直接报 Unknown at rule 或 Invalid CSS —— 它压根不认这些 token，连 // sass:disable-next-line 都绕不过语法层报错。
Miller (mlr) 是一个命令行工具，用于查询、整形和重新格式化名称索引数据，如 CSV、TSV、JSON 和 JSON Lines。它将 awk、sed、cut、join 和 sort 的功能整合到一个专为结构化数据处理而构建的单一工具中。
Dart Sass 把 CSS 原生部分交给标准 parser，Sass 扩展逻辑再叠加，所以这些特性能无损通过：
-
@use "sass:math"和@use "sass:color"提供了对color-mix()、hwb()、相对颜色语法等的完整支持 -
@container、@layer、@starting-style等级媒体查询和层叠控制规则，Dart Sass 输出的就是合法 CSS - Vite 或 Vue CLI 的
sass-loader若还配着implementation: require('node-sass')，工具链会在解析 import 阶段就崩溃
::v-deep 写法差异暴露迁移盲区
Vue 项目里最常踩的坑不是语法，而是选择器容错性变化：::v-deep.foo 在 Node-Sass 下被容忍（当成伪类连写），但在 Dart Sass 下必须写成 ::v-deep .foo（带空格），否则解析为伪类名而非组合选择器，样式直接丢失。
这不是 Dart Sass “变严格”，而是它终于按 CSS 规范做事了——::v-deep 是一个伪元素，后面必须接空格才能表示后代关系。
- 错误写法：
::v-deep.foo→ Dart Sass 认为是未知伪类，报Invalid selector - 正确写法：
::v-deep .foo→ 显式表达作用域穿透 + 后代匹配 - 更现代的替代：
:deep(.foo)（Vue 3 推荐），但前提是 loader 用的是sass而非node-sass
真正难的不是换包，是工具链里那些隐式依赖 Node-Sass 行为的配置和写法——它们往往藏在 loader 选项、自定义 webpack 插件、甚至 CI 脚本里，只有编译失败那一刻才浮出水面。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
