umi修改antd主题颜色（通过less文件修改）

方式一：

在 less 中引入，如下：需要每个 less 文件中引用，所以舍弃

@import '~antd/lib/style/themes/default.less';

 

方式二：

将 less 转换为 js 文件，通过修改 umi 的配置 theme 字段实现，比较繁琐；参考：直达链接

 

方式三：

 配置 lessLoader，一劳永逸，采用此方案

1. 通过js文件修改

ant.design官网已写明

2. 通过less文件修改

好处： 除了更改变量还可以写入其他样式；可以直接复制原antd变量进行修改；
方法步骤：

（1）styles文件夹中创建theme文件夹，其中

 

 

 

index.less：引入其他主题相关less文件

common.less： 公共样式

button.less： 按钮相关样式

（2）.umirc.ts中引入

lessLoader: {
    modifyVars: {
          // 或者可以通过 less 文件覆盖（文件路径为绝对路径）
          hack: 'true; @import "~@homed/mortise-ui/es/components/style/themes-override/color.less";',
    },
},