Less 3.1.0+ 才稳定支持 .each() 遍历 Map，需转为 keys/values list 后索引取值；map-get 不支持嵌套路径访问，须分层调用；Map 为静态编译期结构，无运行时响应式更新。
Less 3.0+ 的 map-get 确实能查 Map，但不能直接遍历或“映射”
Less 没有 map-map 或 map-filter 这类函数，所谓“映射 Map 结构”其实是靠 .each() + map-get 组合模拟。你写 map-get($colors, primary) 能取值，但想批量生成 CSS 类（比如 .text-primary、.bg-secondary），必须用 .each() 遍历键值对——而这个能力从 Less 3.1.0 才稳定支持，3.0.x 有 bug，容易报 Cannot call method 'each' on null。
实操建议：
- 确认版本：
lessc --version输出至少为3.1.0，否则升级再动手 - Map 必须是顶层变量，不能是嵌套在另一个 map 里的子值（
map-get(map-get($themes, dark), colors)会失败） - 键名必须是字符串或标识符，不支持变量插值作键（
map-get($map, @key)在 .each 外部不可靠）
用 .each() 遍历 Map 生成原子类时，键和值要显式解构
Less 不像 JavaScript 有解构赋值，.each($map) 的回调只传入一个参数（当前项），需手动用 map-keys 和 map-values 对齐索引，或更稳妥地先转成 list：
@colors: (
primary: #007bff,
success: #28a745,
warning: #ffc107
);
// ✅ 推荐：转 list 后按索引取键/值
@color-keys: map-keys(@colors);
@color-vals: map-values(@colors);
.each(@color-keys) {
@i: index(@color-keys, @value);
@key: extract(@color-keys, @i);
@val: extract(@color-vals, @i);
.text-@{key} { color: @val; }
.bg-@{key} { background-color: @val; }
}
常见错误：
立即学习“前端免费学习笔记（深入）”；
- 直接写
.each(@colors) { ... }→ 报错，因为.each不接受 map 类型参数（Less 3.1+ 仍不支持） - 用
@key: @value假设回调参数是键 → 实际是整个键值对对象，类型为map，无法直接拼接 class 名 - 在
.each内调用map-get(@colors, @value)→@value是键名字符串，但可能含空格或特殊字符，导致解析失败
Map 嵌套时查找要分层，map-get 不支持路径式访问
设计系统常把颜色、间距、圆角分主题组织，例如：$theme: (light: (colors: (primary: #007bff), spacing: (sm: 4px)), dark: (...))。这时不能写 map-get($theme, light.colors.primary)，Less 不支持点号或斜杠路径。
必须拆成多层 map-get 调用：
@light-theme: map-get($theme, light); @light-colors: map-get(@light-theme, colors); @primary: map-get(@light-colors, primary); // ✅ 得到 #007bff // ❌ 错误写法（语法错误） // @primary: map-get($theme, "light.colors.primary");
性能提示：
- 每层
map-get都是 O(n) 查找，嵌套深了编译变慢，建议扁平化结构（如用命名约定：$colors-light-primary） - 避免在循环内重复做多层
map-get，提前提取到变量 - Less 无缓存机制，相同
map-get表达式多次出现，就多次执行查找
导出 Map 到 JS 时，JSON.stringify 会丢键顺序和注释
有些团队用 Less Map 存设计令牌，再通过构建脚本读取并同步到 JS 或文档。但 Less 编译器输出的是 CSS，不是 JSON；若用正则从源码提取，会丢失顺序（Less 解析后 map-keys 顺序不确定），且注释（如 // 主色系）完全不可见。
可行路径：
- 维护一份独立的 JSON/YAML 源（如
tokens.json），用脚本生成 Less 变量文件，而非反向提取 - 用 PostCSS 插件（如
postcss-less-vars）在 CSS 构建流程中注入变量，绕过 Less 的 map 限制 - Less 本身不提供运行时反射，
map-keys($map)返回的列表顺序不保证与源码一致，别依赖它做有序生成
最易被忽略的一点：Less 的 Map 是编译期静态结构，没有“响应式更新”概念。改一个值，必须全量重编译，没法像 JS 对象那样监听变更或做增量更新。
