ant design 主题变量未生效的根源是变量未进入编译上下文，必须在 @import '~antd/dist/antd.less' 前定义并确保 javascriptenabled: true 开启，且避免作用域错位与命名冲突。
Less 主题变量覆盖顺序不正确，根本不是“顺序写错了”，而是变量在编译期被静默覆盖、注入时机错位、或构建链路压根没走通——@primary-color改了但没生效，90% 是因为变量压根没进到 antd 的编译上下文里。
变量定义位置必须在 antd.less 导入之前
Ant Design 的组件样式（如 .ant-btn）在 @import '~antd/dist/antd.less' 时就按当前上下文的 @primary-color 值展开成 CSS。你如果把它写在后面，或者分散在多个文件里，等于对空空气赋值。
-
@import '~antd/lib/style/themes/default.less';必须是第一行（它提供原始变量定义） - 所有重定义（如
@primary-color: #ff6b35;）必须紧接其后、且在@import '~antd/dist/antd.less';之前 - 禁止在
Button.module.less或任意组件级样式中重定义主题变量——作用域太窄，不参与全局编译 - 路径写错（比如少个
/或拼成theme/default.less）会导致导入失败，后续变量全变成undefined
modifyVars 不生效，大概率漏了 javascriptEnabled: true
Ant Design 的主题变量大量依赖 Less 内联 JS 表达式，例如 color(~`colorPalette('@primary-color', 5)`)。没有开启 JS 支持，这些表达式直接被跳过，modifyVars 就形同虚设。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- Webpack（
less-loader@8+）：必须显式配置lessOptions.javascriptEnabled: true - Vite：需在
vite.config.ts的css.preprocessorOptions.less中同样设置 - CRA 项目：必须用
craco-less，并在craco.config.js中启用该选项 - 若对
node_modules/antd加了include，你的自定义主题文件可能根本没走modifyVars流程
@import 顺序错位导致 Variable is undefined
Less 的 @import 是纯文本拼接，不是模块加载。变量必须在使用前定义，顺序错了就找不到——而且错误不会报红，只会静默输出 color: @primary-color; 这种非法 CSS。
- 错误写法：
@import "button.less"; @import "variables.less";→button.less里引用的@primary-color还没出现 -
@import (once)只防同一文件重复引入，不解决顺序问题 - Webpack/Vite 并行处理多个入口时，
variables.less可能被多次引入，变量反复覆盖，最终生效的是最后一个 - 别在嵌套块里写
@import（如.theme-dark { @import "dark-vars.less"; }），导入内容会被塞进当前块，变量位置失控
变量命名没隔离，多个文件互相覆盖
Less 变量无作用域，@primary-color 在 button.less、modal.less、header.less 各自定义一次，最终生效的是最后一个 @import 进来的值——这不是 bug，是设计行为。
- 强制加前缀：
@btn-primary-bg、@modal-header-padding，杜绝泛义名 - 不要把通用变量（如
@primary-color）放在@import (reference)文件里——它不输出 CSS，但变量照样注入全局 - 推荐结构：
variables.less（只放基础色值）、variables-btn.less（全部带前缀），避免跨文件隐式依赖 - 声明必须带分号：
@spacing-xs: 4px;，少了分号，Less 不报错，但会跳过该行及之后所有变量声明
最常被忽略的一点：你看到的「变量覆盖顺序」，其实是编译器线性处理变量表的结果——它没有栈、没有闭包、不回溯。一旦某条规则已用 @primary-color 展开成 color: #1890ff，后面无论怎么改，那条 CSS 都不会再动。排查时别只看变量定义位置，要打开编译后的 CSS 源码，确认目标选择器里的颜色值是不是你期望的那个字面量。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
