React项目脚手架的简单构建

一、简介
相对于vue，在react中很多东西需要自己去构建，比如网络请求、路由、redux、导航条，如果直接写会产生大量重复代码，并且后期难以维护，通过封装，将以上提到的功能封装成一个个文件夹，需要添加或修改直接去对应的地方找即可，维护成本会降低很多。

二、准备
1、全局安装

npm install -g create-react-app  

2、创建一个react项目（eact-demo为项目名）

create-react-app react-demo

3、进入项目目录安装需要的的插件

npm i react-router-dom@5.3.0 -s

npm i react-router@6.0.2 -s

npm i axios

npm i react-redux@5.1.2 -s

安装移动端第三方插件库antd-mobile（自定义navbar中间和右边点击事件用到，写项目时也可能会用到）

npm install --save antd-mobile@next

例如创建一个my-app

        npm create-react-app my-app

创建axios

        npm install axios -S

安装轮播图组件

        npm install --save swiper     //    npm i swiper@5.3.0 --save

安装第三方(ant design)

        npm install --save antd-mobile@next

安装路由

        npm install react-router-dom@5.3.0 -s

状态管理器

        npm install react-redux redux -S

4、npm start 运行项目