在 React 开始 React-Scripts

从头开始构建 React 应用程序在技术上是可行的，但你必须创建所有文件并调整配置，这可能非常耗时。因此，你可以使用 create-react-app，它为开发你的 React 应用程序提供了一个友好的环境。它还包括可用于启动开发服务器、启用热重载和其他基本功能的脚本和配置。

create-react-app 中的 react-scripts

安装 create-react-app 包允许你使用一个命令设置功能齐全的 React 应用程序。作为开发人员，你只需在命令行中键入 npm run start 即可在本地主机服务器上创建实时应用程序。基本的 create-react-app 配置还包括运行应用程序所需的一整套脚本。这样配置是为了省去初学者自己配置项目的麻烦。但是，可以在 package.json 文件中自定义 react-scripts。

react-scripts start

要执行此脚本，请在命令行中运行 npm run start。你也可以使用速记命令 npm start。它告诉 create-react-app 设置开发环境、启动本地服务器和热模块重新加载。

你的 package.json 文件应该包含一个 scripts 对象，带有引用脚本名称和执行引用的键值对。这只是告诉 React 执行 npm-run-all -p watch-css start-js 命令的一种更简单的方法，该命令执行多个操作。在这种情况下，npm run start 会触发两个脚本的执行：watch-css 和 start-js。前者确保将 .scss 文件转换为常规的 .css 文件，并且你的样式更改会自动反映在你的应用程序中。后者告诉 React 在开发模式下设置应用程序并使用 localhost:3000 来托管它。

定制

npm start 只是一个命令。如果需要，你可以自定义其操作。例如，你可以配置 localhost 端口来托管应用程序。下面是一个例子：

'scripts': {
  'start': 'set PORT=8000 && react-scripts start',
  'build': 'react-scripts build',
  'test': 'react-scripts test',
  'eject': 'react-scripts eject'
}

在这里，我们明确地告诉脚本使用 localhost:8000 端口而不是默认端口。

你还可以通过在命令行中输入 npm run scriptName 来运行其他脚本。如果你正在运行 create-react-app 应用程序并且无法弄清楚 script 的作用，请查看 package.json 文件。