dart sass是唯一能正确编译现代css语法的预处理器，因其分层解析机制将calc()、@container等原生特性交标准parser处理，而node sass依赖已废弃的libsass，词法层即崩溃。
直接换包不等于样式不变——node-sass 和 sass 对除法、/deep/、@import 作用域的处理逻辑完全不同，不调整代码，编译出来的 CSS 很可能视觉错位或完全失效。
为什么变量和函数突然报 undefined
Dart Sass 默认启用模块化作用域（legacy: false），@import 不再自动把变量/函数注入全局。原来靠“污染”实现的共享方式彻底失效。
-
@import "variables"→ 改为@use "variables" as *（全局混入）或@use "variables"+ 显式前缀如variables.$primary -
percentage(50px)报错 → 改用math.percentage(50px)，需先@use "sass:math" -
$font-size-base / 2触发警告 → 改为math.div($font-size-base, 2)，否则 Dart Sass 2.0+ 会直接报错
为什么 /deep/ 和 ::v-deep 编译失败
/deep/ 是非标准语法，Dart Sass 在词法解析阶段就拒绝它；::v-deep 也必须带空格才被识别为伪类修饰符，否则当成无效选择器。
Rydberg Agent Node
下载
使用一条命令部署ProbeChain Rydberg测试网代理节点。自动注册为Agent(NodeType=1)，免gas，支持macOS/Linux/Windows。触发词：/r
-
/deep/ .btn→ 必须删掉，Dart Sass 不支持 -
::v-deep.btn→ 错误，缺少空格 → 正确写法：::v-deep .btn - Vue 2 项目若无法改代码，可在构建配置中临时指定
sassImplementationName: "node-sass"（仅限 uni-app 等特定环境）
为什么 calc() 里写 100% / 3 直接崩
node-sass 把所有 / 当作 Sass 运算符，连 calc() 内部都不放过；Dart Sass 则按 CSS 规范优先解析原生函数，/ 在 calc() 中就是除法符号。
-
width: calc(100% / 3);→ Dart Sass 正常输出，node-sass报Invalid CSS after "100%": expected expression - 若仍想兼容旧写法，可用括号绕过：
width: calc((100%) / 3);（但推荐直接信任 Dart Sass 的行为） -
// sass:disable-next-line对这类词法错误无效——错误发生在解析器层面，注释根本没被读到
为什么装了 sass 样式还是不生效
常见静默失败：loader 没 fallback 但也没真正用上新包，或者缓存残留导致旧逻辑仍在运行。
- 运行
npm ls node-sass确认已清空依赖树；若有输出，说明某子包仍偷偷拉取node-sass - 删掉
vue.config.js或webpack.config.js中的implementation: require('node-sass')——现代sass-loader会自动找sass - 强制清缓存：
rm -rf node_modules/.cache（Webpack/Vue CLI 缓存常卡住旧实现） - 检查
sass-loader版本：Vue CLI 4需配sass-loader@12.6.0，Vue CLI 5可用@latest；sass@1.75.0+要求sass-loader@14+，别盲目装最新版
真正难的不是执行命令，而是接受一个事实：Node Sass 的“兼容”是靠忽略规范换来的，而 Dart Sass 的“报错”恰恰说明它终于开始认真对待 CSS 和 Sass 的语义边界。路径、除法、作用域、深度选择器——每个看似微小的差异，都对应着一次对原有假设的修正。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
