ant design 5 可通过 less 构建时编译定制主题，需先导入 antd.variable.less 再覆盖变量，用 lessc --js 编译为独立 css；不可与 configprovider.theme 混用，ssr 场景必须用此方案。
Ant Design 5 默认启用 CSS-in-JS，但你完全可以在项目中继续用 Less 编译主题、用纯 CSS 引入样式——只要绕开官方默认的运行时样式注入链，走构建时编译路径即可。
为什么直接 import 'antd/dist/antd.css' 后改 Less 变量无效？
因为 antd/dist/antd.css 是预编译好的静态文件，变量早已固化成具体颜色和尺寸。你在 Less 文件里重写 @primary-color，对它毫无影响——它根本没参与编译过程。
- 所有自定义变量必须在
antd/dist/antd.variable.less（v5）或antd/dist/antd.less（v4 兼容模式）加载前注入 - 不能在组件级
Button.module.less里覆盖全局变量，作用域不生效 - Webpack 项目需确保
less-loader配置了javascriptEnabled: true，否则color(~`@{primary-color}`)类函数会报错
如何用 Less 编译出一套可 CDN 引入的 antd 主题 CSS？
目标是生成一个独立的 my-theme.css，不依赖 JS 运行时，适合 SSR、微前端或传统 HTML 页面直接 <link> 引入。
- 新建
src/theme.less，第一行必须是@import "antd/dist/antd.variable.less";（v5）或@import "antd/dist/antd.less";（v4 兼容） - 紧接着写变量覆盖，例如：
@primary-color: #13c2c2;、@border-radius-base: 4px;，不要加!important或重写选择器 - 用
lessc --js src/theme.less dist/my-theme.css编译，--js参数不可省——v5 的antd.variable.less内含 JS 计算逻辑 - 若用 Node.js 脚本调用，传入选项
{ javascriptEnabled: true }
ConfigProvider.theme 和 Less 主题能混用吗？
不能。二者属于完全不同的机制：前者是运行时 CSS Variables 注入，后者是构建时 class 名+值固化。混用会导致样式冲突或覆盖失效。
-
ConfigProvider修改的token会生成--ant-primary-color等 CSS 变量，由 JS 动态写入:root；而 Less 编译结果里全是.ant-btn { color: #13c2c2; }这类硬编码 - 如果用了
ConfigProvider，就别再引入自己编译的 Less CSS，否则按钮颜色可能被两套规则反复覆盖 - SSR 场景下优先选 Less 编译方案——服务端无法执行 JS 注入 CSS 变量，
ConfigProvider的 theme 在首屏会失效
真正麻烦的不是写几行 Less，而是变量注入时机和编译链路是否完整。漏掉 --js、错放 @import 顺序、或留着 antd.css 不删，都会让整个主题定制静默失败。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
