SCSS多文件变量引用疑问：为何c.scss无法调用a.scss的$color变量

当然可以，但你得搞清楚SCSS @use 规则的核心特性——它是模块化的导入方式，默认不会把依赖模块的变量透传给上层引用的文件。你现在的情况是：b.scss用@use a as *引入了a的变量，但这些变量只会在b.scss内部生效，不会自动暴露给引用b.scss的c.scss，所以c里直接用$color才会报“variable undefined”错误。

解决办法有几种，选适合你的场景即可：

• 直接在c.scss里引入a.scss：在c.scss开头加@use 'a' as *;，这样就能直接调用$color，不用通过b.scss中转。
• 让b.scss转发a.scss的变量：在b.scss里添加@forward 'a' as *;（或者用@forward 'a' show $color;只导出需要的变量，更严谨），这样当c.scss用@use b as *引入时，就能拿到a里的$color了。
• 在b.scss里重新导出变量：因为b.scss已经能拿到a的$color，可以在b.scss里加一行$color: $color;，把变量重新声明导出，这样c.scss引入b后也能使用这个变量。

内容的提问来源于stack exchange，提问作者yu hao