antd按需加载

非按需加载

App.js

import { Button } from 'antd';

index.css或者App.css

@import '~antd/dist/antd.css';

按需加载

1. 去掉 App.css 中的 @import ‘~antd/dist/antd.css’;

2. 安装依赖

   yarn add babel-plugin-import react-app-rewired customize-cra

3. 在项目根目录创建一个 config-overrides.js 用于修改默认配置。

   const { override, fixBabelImports } = require('customize-cra');
   module.exports = override(
    fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: 'css',
   }),
   );

4. package.json文件中的 react-scripts 全部替换为 react-app-rewired

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

```