关于Antd的动态换肤？

Question

antd现在有一个动态换肤的方案，但是支持的颜色太少。

有没有基于less的换肤方案，比如点击换肤的时候，loading直到新的less编译完成换肤

Answer 1

只要你的项目样式是用less编写的，都可以使用less.js官方提供的换肤方案。
这个方案原理很简单，html插入你的样式文件（.less为后缀）, less.js会解析.less后缀的文件并插入style标签。然后你只需要运行时调用less.js提供的函数，把新的变量颜色传进去，less.js会去读取那个style样式内容，修改里面的值。

less.js

Answer 2

antd v4及以前的版本，暴露出来的颜色变量只这么多：https://github.com/ant-design...

v5 会重点解决这个问题，不过还不是正式版，成本也有点大。

提供个思路，在组件最外层，比如 div#app 这个控制一个 class 样式名，提前预知好几套覆盖antd 样式的文件。

如果是自定义皮肤，思路类似，只是覆盖antd样式时可通过css变量的方式。