為了在react中使用antd以及它的主題更改，需要在項(xiàng)目中 yarn eject 暴露出webpack文件進(jìn)行改造
本答案是在日期當(dāng)時(shí)最新的create-react-app上的webpack版本

less-loader的配置
安裝less less-loader兩個(gè)包
yarn add less less-loader
//配置less的變量
const lessRegex = /.less/;

 //less配置(模仿css的配置改寫)
                       {
              test: lessRegex,
              exclude: lessModuleRegex,
              use: getStyleLoaders({
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
              }, 'less-loader'),
          },
          {
              test: lessModuleRegex,
              use: getStyleLoaders({
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                  modules: true,
                  getLocalIdent: getCSSModuleLocalIdent,
              },'less-loader'),
          },

設(shè)置后可以新建less文件用簡單樣式去檢測是否生效，要記得重啟項(xiàng)目。
Babel-plugin-import(antd的按需加載設(shè)置)
安裝插件
yarn add babel-plugin-import
修改package.json(或新建文件.babellrc進(jìn)行編輯，但兩者只能存一種)

"babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
      [
        "import",{"libraryName":"antd","style":"css"}
      ]
    ]
  }

根據(jù)webpack配置更改antd主題顏色
在webpack.config.js中找到preProcessor

    //原配置

    if (preProcessor) {
      loaders.push({
        loader: require.resolve(preProcessor),
        options: {
          sourceMap: isEnvProduction && shouldUseSourceMap,
        },
      });
    }

注釋后更改為

    /**
     * 定義全局樣式配置
     */
    if (preProcessor) {
      let loader = require.resolve(preProcessor)
      if(preProcessor === 'less-loader') {
        loader = {
          loader,
          options: {
            modifyVars: {
              //自定義主題
              'primary-color': '#1890ff',
            },
            javascriptEnabled: true,
          }
        }
      }
      loaders.push(loader);
    }
    return loaders;
  };

只需修改primary-color的顏色，再重啟項(xiàng)目即可更改主題顏色

轉(zhuǎn)載于https://segmentfault.com/a/1190000019766645