create-react-app是启动一个React应用程序的最简单方法

create-react-app是启动一个React应用程序的最简单方法

create-react-app是一个旨在让你在短时间内掌握React的项目。它提供了一个现成的React应用启动器，所以你可以潜心构建你的应用，而不需要处理Webpack和Babel配置问题。

它提供了开箱即用的

• 一个具有热重载功能的开发服务器
• 提供一个带有Jest的测试环境
• 允许建立React应用程序
• 为ES6+语法做好准备
• 捆绑你所有的JavaScript和资产
• 支持CSS自动修正器、SASS和CSS模块
• 以及更多

你可以通过使用 npxnpm ，这是一个下载和执行Node.js命令的简单方法，无需安装它们。npx （自5.2版起），如果你还没有安装npm，现在就从nodejs.org（npm与Node一起安装）。

如果你不确定你的版本，我建议你查看是否需要更新。

提示：如果你不熟悉，可以看看我在flaviocopes.com/macos-termi…的终端教程

当你运行npx create-react-app <app-name> ，npx 将会下载最新的create-react-app 版本，运行它，然后从你的系统中删除它。这很好，因为你的系统上永远不会有一个过时的版本，而且每次你运行它，你都会得到最新、最棒的代码。

那我们就开始吧。

npx create-react-app todolist

这是它完成运行的时候。

create-react-app 在你告诉的文件夹中创建了一个文件结构（本例中为 ），并初始化了一个todolist Git仓库。

它还在package.json 文件中添加了一些命令，因此你可以通过进入该文件夹并运行npm start ，立即启动该应用程序。

除了npm start ，create-react-app 还添加了其他一些命令。

• npm run build：在build 文件夹中构建React应用程序文件，准备部署到服务器上。
• npm test：使用Jest运行测试套件
• npm eject弹出：从create-react-app

弹出是决定create-react-app 已经为你做得够多了，但你想做的比它所允许的更多。

由于create-react-app 是一套共同点的约定和有限的选项，在某种程度上可以保证，在某些时候你的需求会要求你做一些独特的事情，超出create-react-app 的能力。

当你弹出时，你失去了自动更新的能力，但你在Babel和Webpack的配置中获得了更多的灵活性。

当你弹出时，这个动作是不可逆的。你将在你的应用程序目录中得到2个新的文件夹，config 和scripts 。这些包含了你所需要的所有配置，现在你可以开始编辑它了。