直接替换@import为@use会编译失败，因Dart Sass 2.0+已彻底移除@import，@use强制命名空间隔离（如colors.$primary-color）、路径须精确匹配下划线partial文件（如_variables.scss）、纯CSS需包装层引入。
直接把 @import 换成 @use 会大面积报错，不是语法替换问题，而是模块系统彻底重写——变量全变私有、路径校验变严格、纯 CSS 文件必须包装，不重构访问方式和文件结构，编译器一步都走不动。
所有变量/混入突然报 “Undefined variable” 怎么办
这不是 bug，是 @use 强制启用命名空间隔离的必然结果。旧写法 $primary-color 会去查全局，但新机制下它只存在于 colors.$primary-color 这个命名空间里。
-
@use "variables"→ 必须写variables.$primary-color，前缀就是文件名（不含_和.scss） -
@use "variables" as v→ 必须写v.$primary-color，写成variables.$primary-color或$primary-color都会失败 - 连字符变量如
$text-sm，不能写成$textSm—— Sass 不做驼峰转换 -
@use "variables" as *可解构，但只能用一次；多个as *会静默覆盖同名变量，不推荐
@use 路径总提示 “No module with the name”
这不是路径写错了，是文件名或位置不合规。@use 不补扩展名、不猜文件名、不搜子目录，只认以 _ 开头的 partial 文件，且路径必须从当前文件出发精确计算。
- 要导入
src/scss/_colors.scss，在src/components/button.scss里得写@use "../../scss/colors"，不能写@use "colors" - 写
@use "_colors"或@use "colors.scss"都会报错 ——@use只接受不带下划线、不带扩展名的模块名 - 路径含空格或中文，Dart Sass 直接拒绝解析，不报错也不警告
- 第三方库（如 Bootstrap 4）仍用
@import，一旦被你的文件间接引入，整个依赖链都会降级回 legacy 模式，@use失效
怎么引入 normalize.css 这类纯 CSS 文件
@use 完全不支持直引 .css 文件，遇到 /* 开头就报 Invalid CSS after ""。必须用一个本地 Sass 文件做“包装层”。
立即学习“前端免费学习笔记（深入）”；
- 新建
_normalize-wrapper.scss（注意下划线），内容只有一行：@import "node_modules/normalize.css/normalize.css"; - 这个包装文件里不能写任何 Sass 逻辑（变量、
@mixin、@use），否则可能触发解析失败 - 主文件中写
@use "normalize-wrapper"或@use "normalize-wrapper" as * - 别写
@use "normalize.css"—— 这既不是合法模块名，也不符合 partial 命名规则
除法运算符 / 全面失效，math.div() 怎么写才不翻车
Dart Sass 2.0 不是“弃用”，而是彻底移除 / 的除法语义。所有未替换的 /（在 calc() 外）都会直接编译失败。
- 必须先
@use "sass:math"，然后用math.div($a, $b)，不能省略math.前缀 - 参数单位必须一致：
math.div(16px, 2)✅，math.div(1rem, 2)❌（1rem是带单位值，但math.div不自动转换单位） -
calc(100% / 3)里的/是安全的，不用改 —— 这是 CSS 原生上下文，由浏览器运行时处理 - 隐藏最深的坑在
grid-template-columns: 1fr / 2fr这类地方：旧写法会被误判为除法，必须改成1fr 2fr或用calc()
真正难的不是改几行代码，而是意识到：Dart Sass 2.0 的报错不是限制你，而是把 CSS 应该有的边界还给你——它不再帮你猜哪边是除法、哪边是分隔符，也不再容忍同名变量静默覆盖。所有路径、前缀、单位、包装层，都是这个边界的自然延伸。
