yarn start 设定端口号
在开发Web应用程序时，我们通常会使用yarn来管理项目的依赖项和运行脚本。其中，yarn start是一条常用的脚本命令，用于启动应用程序的开发服务器。默认情况下，yarn会在指定的端口号上启动服务器，但我们也可以通过一些方法来设定端口号。
本文将为大家介绍如何使用yarn start命令设定端口号，并给出相应的代码示例。
什么是yarn start？
yarn是一个由Facebook开发的现代化JavaScript包管理器，旨在改进npm的不足之处。yarn start是yarn提供的一个内置命令，用于启动项目的开发服务器。
当我们执行yarn start命令时，yarn会首先检查项目的package.json文件中是否定义了"scripts"字段，并找到与"start"对应的命令。然后，它会执行这个命令来启动开发服务器。
设定端口号的方法
yarn start命令默认会在3000端口上启动开发服务器，但有时我们希望在其他端口上启动。以下是几种设定端口号的方法。
方法一：使用命令行参数
在命令行中，我们可以使用--port参数来设定端口号。以下是一个示例：
yarn start --port 8080
这个命令将在8080端口上启动开发服务器。
方法二：修改package.json
我们可以直接修改项目的package.json文件，来设定端口号。在"scripts"字段中，我们可以使用PORT环境变量来指定端口号。以下是一个示例：
"scripts": {
"start": "PORT=8080 react-scripts start"
}
这个配置将在8080端口上启动开发服务器。
方法三：使用.env文件
除了修改package.json文件，我们还可以使用.env文件来设定端口号。在项目的根目录下，创建一个名为.env的文件，并在其中添加以下内容：
PORT=8080
这样，yarn start命令将会读取这个文件，并在8080端口上启动开发服务器。
代码示例
接下来，让我们通过一个具体的代码示例来演示如何使用yarn start命令设定端口号。
首先，我们需要在项目中安装create-react-app脚手架，用于创建一个React应用程序。在命令行中执行以下命令：
npx create-react-app my-app
这个命令将在当前目录下创建一个名为my-app的新项目。
然后，进入项目目录并启动开发服务器：
cd my-app
yarn start
默认情况下，开发服务器将在3000端口上启动。现在，我们将介绍如何设定其他的端口号。
方法一：使用命令行参数
在命令行中，执行以下命令：
yarn start --port 8080
这个命令将在8080端口上启动开发服务器。你可以在浏览器中访问http://localhost:8080来查看应用程序。
方法二：修改package.json
打开项目中的package.json文件，并修改"scripts"字段如下：
"scripts": {
"start": "PORT=8080 react-scripts start"
}
保存文件后，重新启动开发服务器：
yarn start
现在，开发服务器将在8080端口上启动。
方法三：使用.env文件
在项目的根目录下，创建一个名为.env的文件，并添加以下内容：
PORT=8080
保存文件后，重新启动开发服务器：
yarn start
现在，开发服务器将在8080端口上启动。
总结
通过本文，我们了解了如何使用yarn start命令设定端口号。我们可以通过命令行参数、修改package.json文件或使用.env文件来设定端口号。
flowchart TD
A(启动开发服务器) --> B{
