dart sass是唯一能正确编译现代css语法的预处理器，因其采用分层解析将原生css交标准parser处理，确保calc()、@container、color-mix()等无损透出，而node sass依赖已停更的libsass，词法层即崩溃。
Node Sass根本解析不了现代CSS语法，不是“不同”，是“直接崩溃”
Node Sass用的是已停更的libsass，它的词法解析器把/一律当Sass除法运算符——哪怕它在calc()里：width: calc(100% / 3); → SassError: Invalid CSS after "100%": expected expression。错误发生在词法阶段，连// sass:disable-next-line都无效，因为压根没走到语义分析层。
Dart Sass则把原生CSS交给标准parser处理，Sass逻辑后置叠加，所以@container、color-mix()、relative color syntax这些能原样透出，不干扰也不报错。
Dart Sass按规范解析::v-deep，空格是必须的
Node Sass把::v-deep当成伪类名宽松处理；Dart Sass严格按CSS规范：::v-deep是伪元素，后面必须有空格才表示后代选择器关系。
- ❌ 错误写法：
::v-deep.button（被解析为伪元素名，无匹配） - ✅ 正确写法：
::v-deep .button（注意空格，表示“后代”） -
/deep/和>>已彻底移除，loader降级无效
@mixin插入位置决定CSS顺序，跟定义位置无关
Dart Sass的AST遍历是深度优先 + 按源码声明顺序访问兄弟节点，但@mixin本身不产出CSS，只有@include处才真实插入样式块。
这意味着：
- 你在文件末尾定义
@mixin card() { ... }，但在开头@include card()→ 对应CSS出现在开头 - 多个
@include跨文件调用时，最终顺序取决于@include在入口文件中的出现顺序，不是@use或@import顺序 - Node Sass早期版本曾因AST缓存策略导致顺序不稳定，但Dart Sass行为确定且可预测
除法运算符/已被弃用，math.div()是唯一可靠写法
Dart Sass从1.60.0起发出警告：WARNING: Using / for division is deprecated，2.0.0将彻底移除。这不是风格问题，而是避免与CSS原生/（如grid-template: 1fr / 2fr）冲突。
- 必须改写：
width: 100px / 2;→width: math.div(100px, 2); - 需提前
@use "sass:math";，否则math.div不可用 - 旧项目全局搜索
/并人工判断上下文——仅当左侧是数字/长度且右侧是数字时才需替换
node-sass引用。哪怕你装了sass，只要sass-loader配置里还写着implementation: require('node-sass')，或者package-lock.json里没清干净node-sass依赖，编译就会 fallback 到旧引擎，报错却提示不明原因。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
