react项目如何按需加载antdDesign组件

react项目如何按需加载antdDesign组件分为两种情况:
第一种(使用脚手架create-react-app)
先安装依赖:

npm i babel-plugin-import --save

然后, 在package.json里面直接添加下面这行代码

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

第二种(不使用脚手架, 手写)
1,安装

npm install ant --save

2,引用

import { Form, Input, Button} from 'antd';

3,安装组件

npm i babel-plugin-import --save -D

4,按需加载Ant Design,在.babelrc文件中增加以下内容,即可进行按需加载

 "plugins": [
        [
            "import",
            {
                "libraryName": "antd",
                "libraryDirectory": "es",
                "style": "css"
            }
        ],
        "transform-runtime"
    ]

转载地址:https://blog.csdn.net/qq_24147051/article/details/88318895

你可能感兴趣的:(react项目如何按需加载antdDesign组件)