开始之前,看看react有哪些常用的脚手架

其中create-react-app 是最常用 的脚手架

create-react-app使用

1.安装

全局安装

1
npm install -g create-react-app

2.创建项目

1
create-react-app my-app

目录

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
my-app
|--build //构建目录,遵循发布系统规范
| |-- index.html //静态页面
| |-- static //资源文件
|
|-- node_modules //项目组件文件夹:所有安装的组件都在这
|
|--src //源码目录
| |--index.js //入口文件(还生成了其它的文件,但是没啥用,我们可以直接的删除掉)
|
|--public //静态页面目录
| |--index.html //主页面(还生成了其它的文件,但是没啥用,我们可以直接的删除掉)
|
|-- .gitignore //git提交的忽略文件,我们一般还需要再手动增加.idea(通过webstorm编辑工具进行开发,生成的文件)
|--package.json //项目依赖项及项目基础信息
|--README.md //项目描述
|-- ...

3.运行项目

1
2
cd my-app
npm run start

打开webpack配置

默认是没打开webpack配置的

1
yarn eject或者npm run eject 此命令执行完成不可逆转(慎重使用)