cli(脚手架)全称commond line interface(命令行界面)，是通过命令行帮助我们快速的搭建前端项目的一种工具。脚手架有以下优点：
- 提高开发效率
- 降低开发难度，不需要关心底层配置、只要会使用前端框架就能开发应用。
- 统一项目的开发风格和规范
create-react-app是react官方的脚手架，它可以帮助我们快速的搭建react项目，并且集成了webpack、babel等前端开发环境。很多公司都有自己个性化的脚手架，有的是基于create-react-app的、有的则完全是自己实现的，那么当我们熟悉了cra（create-react-app的简称）之后，我们就可以根据自己的需求来定制自己的脚手架。
cra运行流程分析
npx create-react-app my-app
npx create-react-app my-app --template typescript
在执行了上面的命令之后，cra的运行逻辑大概如下：
- 根据命令行输入错命令以及参数判断要创建项目名称、项目模板、依赖等。
- 下载模板文件和react-scripts，其中react-scripts是cra的核心依赖，负责构建、编译、打包react应用， 包含了webpack的配置、babel的配置等。
- 下载项目依赖，根据模板文件中的package.json文件下载项目依赖。
1). cra的目录结构：
重点关注packages目录：
- create-react-app是cli的入口文件
- cra-template是模板文件
- react-script提供react项目的 构建和运行能力，就是webapck的那一套
- 其余的目录存放一些工具和辅助函数
2). 直接点开create-react-app的index.js,发现它执行的是creatReactApp.js提供的init方法
继续跟踪到creatReactApp.js文件，找到其中的init方法开始分析
这里使用了commonder的npm包，捕获用户在命令行输入的指令，获得项目名称、 verbose、--template等参数。
3). 下面很长一段代码都是对运行环境的检查。
检查项目路径是否存在、项目名称是否合法
检查cra版本
检查node版本
检查使用的是yarn还是npm、检查是否使用pnp
安装reat、react-dom、react-scripts、cra-template
4). 安装成功之后开始执行react/scripts的init.js
5). 检查模板的安装环境
6). 根据cra-template的依赖进行修改合并package.json文件
7.） 初始化git仓库并创建第一次提交
8.）安装依赖
9.) react-scripts中还有start、buid、rject等命令，放到下次讲解
