react中使用antd组件库的按需引入

react项目中使用antd组件库，当我们想配置按需加载，需要更改原有的配置文件，由于react对webpack配置文件是默认隐藏的，我们可以使用eject命令显示配置文件，但该命令是不可逆的，我这里使用另一种方式更改：

    npm i react-app-rewired customize-cra -S
    npm i babel-plugin-import -S

（1）在package.json中更改命令，例如npm start命令改为："start": "react-app-rewired start" （2）在根目录下创建config-overrides.js文件，里面配置具体的修改规则

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

配置完之后，在react中使用antd由

    import { DatePicker } from 'antd';
    import 'antd/dist/antd.css';

改成

    import { DatePicker } from 'antd';

不需要引入全部的css样式了 在antd官网中也有显示 以上方法适用于antd3x版本

关于React18安装antd的按需引入配置看下面CSDN博主「小鑫学习笔录」的文章 blog.csdn.net/weixin_5161…