React Ant的项目引用的简单应用

react

1.首先我们需要新建一个项目 create-react-app my_app

2.在项目目录通过cmd安装下载引入 antd
Ant Design官网

1 ）通过npm安装
npm install react-router-dom

2 ）通过yarn安装
yarn add react-router-dom)

3.全局引入

在index.js中引入 import ‘antd/dist/antd.css’;

在组件里引入组件就可以使用了，例如组件里使用button:

将组件引入到App.js中

通过在cmd输入npm start或 yarn start启动项目查看效果

4.按需引入

(1) yarn add react-app-rewired customize-cra(npm i react-app-rewired customize-cra)

react-app-rewired 不用弹射就可以配置webpack

customize-cra 自定义脚手架环境

(2)修改package.js的配置

(3)然后在项目的根目录建一个配置文件config-overrides.js ,用于修改默认配置

(4)安装下载babel-plugin-import(用于按需加载组件代码和样式的 babel 插件)

yarn add babel-plugin-import(npm i babel-plugin-import)

(5)在config-overrides.js中写入:

(6)然后在项目中可以按需引入,例如在App.js中

更多配置问题及引入组件查看官网

我是小白，以上为个人理解，如有问题请指出