create-react-app+webpack+antd项目配置流程

前置条件：安装npm，create-react-app

1、create-react-app 新建项目

代码：create-react-app web-login（项目名称）以下均以web-login项目为例

文件结构如下：

2、修改文件结构

在src下新增：

assets：存放png、jpg、gif、sag等，

components ：存放模块文件

css：样式文件

3、移动文件

在componets文件夹下新建App，将App相关文件移到下面。（App.css、App.js、App.test.js）

将logo.svg文件移到assets下。

这步完成之后目录结构如下：

4、修改文件index.js,App.js文件引用路径

5、终端进入web-login文件夹，运行npm run start 或者yarn start，出现以下界面表示运行成功

浏览器打开： http://localhost:3000/

出现以下页面，表示运行成功：

ctrl+c可以结束终端运行进程

6、安装antd开发环境，实现antd控件按需加载，并可以定制主题颜色。

因为开发需要自定义webpack 配置，所以需要把create-react-app脚手架自动生成的配置文件暴露出来。

运行npm run eject  或者 yarn eject

注意，此过程不可逆

出现如下提示，表示文件暴露成功