sass自检函数无法检测css变量，因variable-exists()仅查sass符号表中的$变量，对--color等css自定义属性完全无效，且type-of()也无法判断其类型或存在性。
不能用 Sass 自检函数检测 CSS 变量是否“已正确定义”——因为它们根本看不见 CSS 变量。
variable-exists() 对 --color 这类 CSS 自定义属性完全无效
它只查 Sass 符号表里的 $color，不识别 --color。哪怕你在 :root 里写了 --color: red，variable-exists("color") 仍返回 false；写成 variable-exists(--color) 则直接编译报错：Invalid variable name。
常见误用场景：
- 在 mixin 中写
@if variable-exists(theme) { ... }，本意是检查--theme，结果永远进不了分支 - 把
var(--size)赋给$val后再用variable-exists($val)——$val此时是字符串字面量"var(--size)"，不是变量名
type-of() 也无法用于判断 CSS 变量值的类型或存在性
type-of(var(--size)) 返回 "string"，因为 var(--size) 在 Sass 编译期只是普通文本，不是可求值表达式。它不会去解析浏览器运行时才能确定的值。
真正能用 type-of() 的，只有 Sass 变量本身：
-
type-of($size)→ 若$size: 16px，返回"number" -
type-of($size)→ 若$size: null或未声明，返回"null" -
type-of(--size)→ 语法错误，Sass 不认这个写法
想让 CSS 变量“可检测”，必须靠构建时注入 + 运行时兜底组合
所谓“正确定义”，其实是两个层面的事：编译时确保变量名存在（供 fallback），运行时确保有值（供动态响应）。没有单一 Sass 函数能跨过这道鸿沟。
可行路径：
- 在
:root中用插值显式注入：--primary: #{$primary};，确保 CSS 层变量名和值都由 Sass 控制 - 用
var(--primary, #007bff)提供降级，但注意：默认值只在--primary未声明 或被设为initial/unset时生效，设成空字符串""或非法值（如123）不会触发 - 运行时检查必须用 JS：
getComputedStyle(document.documentElement).getPropertyValue('--primary')，返回空字符串""表示未找到，而非“值为空”
最容易被忽略的一点：CSS 变量的“存在性”不是布尔值，而是三态——未声明、声明但无值（initial）、声明且有合法值。Sass 在编译期连第一态都无法触达，所有试图用 variable-exists 或 type-of 去桥接它的方案，本质上都在混淆 build-time 和 run-time 的边界。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
