简介
make-react-app 是一个由 Facebook 开源的基于 React 的脚手架工具，它能够快速创建 React 应用，并包含了开发、构建、测试、部署等多种工具和功能，大大简化了 React 应用的开发流程。本文将详细介绍 make-react-app 的使用方法，帮助前端开发者快速入手。
安装
首先，我们需要使用 npm 安装 make-react-app 包，打开终端并输入以下命令：
npm install -g create-react-app
这将会全局安装 make-react-app 到您的电脑上。
创建项目
安装完了 make-react-app 后，我们可以使用它来创建 React 应用。打开终端，输入以下命令：
create-react-app my-app
其中，my-app 是项目的名称，您可以根据需要替换为其他名称。
等待一段时间后，make-react-app 将会自动完成项目的创建和初始化，您将会看到如下输出：
-- -------------------- ---- -------
-------- - --- ----- --- -- -------
---------- --------- ---- ----- ---- - ------ -- --------
---------- ------ ---------- --- ----------------
---
-------- ------- ------ -- --------------------
------ ---- ---------- --- --- --- ------- ---------
--- -----
------ --- ----------- -------
--- --- -----
------- --- --- ---- ------ ----- --- -----------
--- ----
------ --- ---- -------
--- --- -----
------- ---- ---- --- ------ ---- --- -- ----- -----------
-- ------- ---- --- ----- -- -------
-- ------
--- -----这表明您的项目已经创建成功，并且可以执行下面的命令来开始开发：
cd my-app npm start
现在您可以使用编辑器打开 my-app 文件夹并开始开发了。
开发
在开发过程中，我们可以使用 make-react-app 提供的多个命令来加快开发效率。
npm start
执行 npm start 命令，将会启动开发服务器，自动打开浏览器并展示您的应用。每次修改代码后，make-react-app 会自动重新编译代码并更新页面。
npm test
执行 npm test 命令，将会启动测试服务器并运行您的测试代码。
npm run build
执行 npm run build 命令，将会使用生产模式构建应用，并在 build 文件夹中生成最终的应用文件。这些文件已经经过了压缩和优化，可以直接用于部署。
npm run eject
如果您想要完全掌控应用程序的构建和配置，您可以使用 npm run eject 命令。这将会移除 create-react-app 提供的所有封装，将应用程序配置文件暴露出来，方便您自己进行配置。
示例代码
下面是一个简单的 React 应用示例代码，供参考。
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
----- --- ------- --------- -
------------------ -
-------------
---------- - -
------ -
--
-
-------- -
------ -
-----
--------- -----------
--------- ----------------------
------- ----------- -- --------------- ------ ---------------- - - ----
----- --
---------
------
--
-
-
------ ------- ----总结
通过 make-react-app，我们可以快速创建一个 React 应用，方便开发者快速入手 React，并且提供了多种功能和命令，大大简化了应用的构建和部署流程。希望这篇文章能够帮助读者更好地了解 make-react-app，并顺利完成 React 应用的开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005586181e8991b448d5981