react中antd自定义主题样式,自定义主题样式覆盖

mac2025-10-13  7

一、首先确认package.json less的版本

"less": "^2.7.3",

一定要是2.7.3

二、webapck.base.config.js的loader配置

{ test: /\.less$/, use: ['style-loader', 'css-loader', 'less-loader'], include: [resolve('../src/'), resolve('../node_modules/')] },

三、在你的src文件夹下面写一个defalut.less

@import '~antd/dist/antd.less'; @primary-color: #d11212;

npm run dev直接就能覆盖了

但是打包之后主题颜色还是没有生效,该怎么办呢? 修改webpack.base.conf.js

{ test: /(\.jsx|\.js)$/, include: resolve('src'), loader: 'babel-loader', + query: { // 打包的时候 保证主题能覆盖住 + plugins: [ + ['import', [{ libraryName: "antd", style: true }]], // 加载 less 文件 + ] + } },

加上这句接ok了 有问题联系博主,欢迎交流讨论!

最新回复(0)