前言
构建React项目的几种方式：
- create-react-app 脚手架快速搭建 react 项目（推荐）
- yeoman 脚手架搭建 react 项目
- webpack 一步一步构建 react 项目
脚手架是什么
脚手架是一种约定和规范。可以实现如下规范：
- 相同的文件组织结构；
- 相同的开发范式；
- 相同的模块依赖；
- 相同的工具配置；
- 相同的基础代码；
然后脚手架将这些重复性的约定、规范全部都集成起来，减少这样无意义的操作。
create-react-app 脚手架快速搭建 React 项目
Create React App 中文文档
要求：Node >= 8.10 并且 npm >= 5.6
1、安装 create-react-app
npm install -g create-react-app
2、检测 create-react-app 是否安装成功
create-react-app -V
3、创建 React 项目
npx create-react-app my-app
cd my-app
npm start
说明：npx 是 npm 5.2+ 附带的 package 运行工具。
默认，create react app 创建的项目是看不到 webpack 相关的配置的，如果熟悉 webpack 的小伙伴，知道 package.json 中的配置会很多，而react脚手架中的 package.json 中，依赖为什么这么少。
这是因为像 webpack，babel 等等都是被 creat react app 封装到了 react-scripts 这个项目当中，包括基本启动命令 都是通过调用 react-scripts 这个依赖下面的命令进行启动的。
npm run eject 会将原本 creat react app 对 webpack、babel 等相关配置的封装弹射出来。
如果我们要将 creat react app 配置文件进行修改，现有目录下是没有地方修改的。此时，我们就可以通过 eject 命令将原本被封装到脚手架当中的命令弹射出来，然后就可以在项目的目录下看到很多配置文件。但这个操作是不可逆的，我们无法再通过其他方式将这些暴露出来的配置还原回去。
npm run eject
Yeoman 脚手架搭建 React 项目
1、Yeoman是什么？
Yeoman 最初发布于 2012 年，是一款高效、开源的 Web 应用脚手架（scaffolding）软件，意在精简软件的开发过程。
Yeoman 是现代化前端项目的脚手架工具，可以根据一套模板用于生成包含指定框架结构的工程化目录结构。它是整个前端自动化工厂的第一站，灵活而且很容易扩展。
不同于 vue-cli 这样的工具。Yeoman 更像是一个脚手架的运行平台，可以通过 Yeoman 搭配不同的 generator 去创建任何类型的项目。也就是说我们可以通过创建自己的 generator 从而去定制属于我们自己的前端脚手架。
随着前端工程化的理念不断深入，越来越多的人选择使用脚手架来从零到一搭建自己的项目。随着业务的不断发展，必然会出现需要针对业务开发的实际情况来进行调整。
总而言之，随着业务发展，我们往往会沉淀出一套更“个性化”的业务方案。这时候我们最直接的做法就是开发出一个该方案的脚手架来，以便今后能复用这些最佳实践与方案。
- Yeoman 提供了一种灵活创建、开发、编译和调试 Web 应用的脚手架（scaffolding）软件。
- 虽然 Yeoman 本身是 JavaScript 编写的，但适用于任何语言编写的应用。
- Yeoman 支持与 Webpack、Babel、TypeScript、React 和 Angular 等多种第三方软件库的无缝集成。
- Yeoman 内建立有一个基于 Node.js 的 HTTP 开发服务器，简化了开发环境的设置和开发过程的迭代。
- Yeoman 实现构建过程由开发环境到优化后生产环境间的无缝转移。
Yeoman 其实是3个工具的总和：
-
yo — 脚手架，自动生成工具；
-
Grunt、gulp — 构建工具 （最初只有grunt，后面gulp火了添加进来的）；
-
Bower、npm — 包管理工具 （原来是 bower，后面添加了npm）；
上面的三个是各自独立发展和运行的，混合后效果就不一样，主要在于yo，相当于一个粘合剂一样，把grunt这些工具粘合在一起。
2、安装 Yeoman
npm install -g yo //权限不够，请加上 sudo，一般来说mac都需要。
3、安装 generator 模板
npm install -g generator-react-webpack
4、创建 React 项目
创建一个文件夹
mkdir my-new-project && cd my-new-project
用生成器生成我们的项目目录
yo react-webpack
运行 React 项目
npm start
拓展阅读
