Less 的 when Guard 表达式是编译期静态匹配机制，仅支持字面量、简单算术及 isnumber/iscolor/iskeyword 等类型函数，不支持变量运算、函数调用或字符串拼接；必须紧接 mixin 参数后、无分号，多条件用 and 连接，同名 mixin + Guard 实现重载，兜底分支（无 when）必不可少。
Less 的 when Guard 表达式不是 JavaScript 条件语句，它只在编译期做静态匹配，不支持变量运算、函数调用或运行时逻辑。
Guard 语法必须写在 mixin 定义末尾，且 when 前后不能有分号
常见错误是把 when 当成独立语句，或者混用分号导致整个 mixin 失效：
.btn-size(@size) when (@size = small) {
font-size: 12px;
}
.btn-size(@size) when (@size = large) {
font-size: 16px;
}
注意：when 必须紧贴 mixin 参数括号之后，中间不能换行或加 ;；@size = small 是严格字面量匹配，不是字符串比较 —— small 是关键字，不是引号字符串。
- 支持的比较操作符只有
=、!=、、<code>>=、、<code>>，且仅限于数字、颜色、关键字（如true、auto）之间 - 不能写
when (@size == "small")，双引号会使其变成字符串类型，而small是无引号关键字，类型不一致即不匹配 - 多个条件用逗号分隔，表示“与”关系：
when (@size = large), (@theme = dark)是错的；正确写法是when (@size = large) and (@theme = dark)
Guard 不支持嵌套或动态计算，所有值必须可被编译器静态推断
你不能在 when 中调用 lighten()、unit() 或拼接字符串。下面这些都会报错或静默失效：
.box(@color) when (lighten(@color, 10%) = #fff) { ... } // ❌ 编译时报错
.box(@s) when (unit(@s) = px) { ... } // ❌ unit() 在 guard 中不可用
.box(@n) when ("col-" + @n = "col-2") { ... } // ❌ 不支持字符串拼接
真正能用的，只有原始字面量和简单算术（且仅限数字）：
-
when (@z > 10)✅ -
when (@n = round(3.7))❌round()在 guard 中无效 -
when (isnumber(@n))✅isnumber、iscolor、iskeyword等类型判断函数是少数被允许的
多个同名 mixin + Guard 是实现“重载”的唯一方式
Less 没有 if/else，靠定义多个同名 mixin 并用不同 when 分支覆盖，编译器会按顺序匹配第一个成立的分支：
.text(@weight) when (@weight = bold) {
font-weight: 700;
}
.text(@weight) when (@weight = normal) {
font-weight: 400;
}
.text(@weight) {
font-weight: @weight; // 默认 fallback，无 when 即兜底
}
调用 .text(bold) 会命中第一个；调用 .text(600) 则跳过前两个，执行第三个兜底规则。
- 顺序很重要：更具体的 guard 应放在前面，否则可能被宽泛分支提前捕获
- 兜底分支（无
when）必须存在，否则未匹配时整个 mixin 不生效，也不会报错 - 不支持
else if或default关键字，全靠排列顺序和兜底逻辑模拟
Guard 的本质是编译期模式匹配，不是运行时控制流。一旦你开始想“怎么让 guard 判断一个计算结果”，就说明该逻辑应该移到 JS 层或用 CSS 自定义属性配合 @media / :has() 等现代方案替代。
