@forward 不是导入，它仅建立访问通道而不加载内容，转发文件自身无变量可用；必须配合 @use 才能生效，且需注意 as、with 语法顺序与作用域规则。
@forward 不是导入，别在转发文件里直接用变量
很多人写完 @forward "colors" 就开始写 $primary-color，结果编译直接报 Undefined variable "$primary-color"。这不是路径错，而是误把 @forward 当成了 @use 的快捷写法。
@forward 本身不加载任何内容，它只建立一条“访问通道”：下游 @use 你这个文件时，才能通过命名空间访问被转发模块的成员。转发文件自身作用域里，什么都没有。
- 转发文件（如
_index.scss）里只能写@forward、@use，不能写$spacing-md: 16px或@mixin reset()—— 这些得下沉到子模块 - 如果想让下游能用
index.$primary-color，必须先@use "colors"，再@forward "colors" - 转发文件顶部不能有注释或空行——
@forward必须是文件第一个有效语句
用 as 控制暴露方式，避免命名冲突
多个模块都导出 $radius？Sass 编译器会直接报错 "$radius" is already used，这不是 bug，是保护机制。你得主动隔离。
as 是最轻量的解法：它不改源模块，只给下游加前缀，同时隐藏原始路径。
-
@forward "buttons" as btn-*;→ 下游只能用btn-$radius，无法知道按钮样式实际在components/buttons/_index.scss -
@forward "cards" as card-*;→card-$radius和btn-$radius天然不冲突 -
@forward "utils/breakpoints" as bp-*;→@include bp-max("lg")，下游根本不用关心 breakpoint 定义在哪 - 注意顺序：
as必须写在with前面，@forward "colors" with ($primary: red) as color-*;是非法语法
with 不是设值，是透传配置
with 不影响转发文件自己，只把参数“提前填进”被转发模块的 !default 变量里。下游 @use 时拿到的就是已配置好的版本。
比如 _colors.scss 里定义：$primary: #3b82f6 !default;，那么：
-
@forward "colors" with ($primary: #ef4444);→ 下游@use "index";后，index.$primary就是红色，不是默认蓝色 - 但如果下游自己也带
with：@use "index" with ($primary: #8b5cf6);，则以它的值为准（支持覆盖） - 错误写法：
@forward "colors"; @use "colors" with ($primary: red);→@use已加载默认值，with失效；必须@forward在前 -
with改名后函数调用报Undefined function？说明函数内部依赖未被转发的变量——with只改名，不重绑定作用域
入口文件必须组合 @use + @forward 才真正可用
单靠 @forward 无法让工具包同时支持 @use "kit"、@use "kit" as k 和 @use "kit" as *。入口文件得先 @use 子模块，再 @forward 它们。
- 正确结构：
@use "core/vars" as core; @forward "core/vars" as core-*;→ 下游可选core.$primary或通配符导入 - 入口文件里禁止定义新变量、
@mixin或顶层 CSS 规则——所有逻辑必须下沉，否则转发规则失控 - 路径是相对的：
@forward "../shared/colors"要确保当前文件所在目录上两级真有shared/_colors.scss - VS Code 跳转失效、
Can't find stylesheet to import？八成是相对路径拼错，或漏了_index.scss中转层
复杂点不在语法，而在模块边界的划分意识：哪些该收口到 core/，哪些该按功能拆分，哪些变量必须用 !default 预留配置入口——@forward 只是把这套设计暴露出去的那扇门。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
