脚手架-CLI | 全栈大前端

# 为什么要使用脚手架

除了可以快速创建代码之外，使用相同脚手架创建出来的项目，拥有着相同的文件结构、代码风格、依赖模块、开发工具，这对于同一个团队而言，减少了团队成员之间的沟通和维护成本。

说了这么多，我们来总结一下到底为什么要使用前端脚手架。

方便快捷：我们只需要下载对应的脚手架依赖然后在命令行执行一行命令或者一些初始化信息，就可以将项目的框架搭建完成，整个用时十分钟左右，而自己搭建少则一两个小时，多则一两天。
最佳实践：不管我们使用的是官方提供的脚手架还是团队内部的脚手架，其中的配置或者模板肯定都是经过反复的试错之后提炼出来的最佳实践，我们使用脚手架相当于站在了巨人的肩膀上进行开发。
统一规范：团队的内部使用相同的脚手架创建出来的项目，具有相同的组织结构、依赖模块、工具配置，有利于项目的维护和团队的合作。

# 业界其他脚手架

# Create-React-App

和前面介绍的 Plop、Yeoman 不指定特定框架的脚手架生成器相比，Create-React-App（简称 CRA）和 Vue Cli 恰恰相反。

CRA 是一款 React 官方提供的 React 开发工具集，其中包含了 create-react-app 和 react-script 两个基础包。create-react-app 用于选择脚手架创建项目，而 react-script 是封装了项目启动、编译、测试等基础工具的运行时依赖包。

正是因为 CRA 将运行时的各项配置都封装在 react-script 中了，这大大降低了开发者的学习成本，你不需要选择使用哪个构建工具，不需要选择对应依赖包的版本，不需要去编写并测试那些繁琐的配置文件（特别是 webpack！），开箱即用！自己从 0 到 1 自己搭建过项目的同学都知道，要想成功地将项目启动，少则需要个把小时，多则需要一两天的时间 o(╥﹏╥)o，搭建项目两小时，开发十分钟。而使用 CRA，我们只需要执行 npx create-react-app your-app-name 就可以直接生成一个 React 项目。打开项目后，再执行 npm run start 就可以开发业务代码了！

不过凡事都有利弊，CRA 将所有的细节都封装了起来，虽然降低了创建项目时的成本，但是却增加了后期的维护成本。比如你想要去修改 webpack 的某一项配置，是不能在项目中直接修改的。这个时候就要使用官方提供的 eject 选项将全部配置反编译回项目。但是一旦你这么做了，那么就意味着你放弃了官方提供的各个依赖包的维护。为此，官方又提供了修复包 react-rewired 和 customize-cra ，可以进行自定义配置。