react上安装ant design（版本3.x）

yarn add antd -S

高级配置

引入 react-app-rewired 并修改 package.json 里的启动配置。由于新的 react-app-rewired@2.x 版本的关系，还需要安装 customize-cra。

yarn add react-app-rewired customize-cra -S

在package.json中修改如下：

"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },

4.1 按需加载组件

babel-plugin-import 是一个用于按需加载组件代码和样式的 babel 插件（原理）

yarn add babel-plugin-import

4.2 自定义antd组件主题以及使用less

 yarn add less less-loader -D

这里利用了 less-loader 的 modifyVars 来进行主题配置

最后：安装完按需加载和主题、less的依赖包后，开始进行配置修改，
在根路径下新增一个config-overrides.js文件，代码如下：

const { override, fixBabelImports, addLessLoader } = require('customize-cra');

module.exports = override(
// 按需加载antd组件
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: true,
  }),
  // 自定义主题和使用less
  addLessLoader({
    lessOptions: {
      javascriptEnabled: true,
      modifyVars: { '@primary-color': '#1DA57A' },
    }
  }),
);

注意：
如果是最新下载的脚手架create-react-app，react和相关依赖的版本会过高，导致安装使用less的时候一直出现报错。
将以下依赖包降级就ok啦。

"less": "^3.12.2",
"less-loader": "^6.2.0",
"react-scripts": "3.4.1"