如何在 React.js 中更改端口 - JavaScript

在 React.js 项目开发过程中，通常会使用 create-react-app 工具来初始化项目，create-react-app 默认使用3000端口来运行服务器。但是，在某些情况下我们可能需要修改默认端口，这篇文章将向您介绍如何在 React.js 中更改端口。

创建环境变量

React.js 提供了一种简单的方式来定义环境变量，可以使用环境变量来配置应用程序的不同方面，例如端口。您可以在项目的根目录中创建一个名为 .env 的文件来定义您的环境变量。

在 .env 中添加以下代码：

PORT=8080

这将告诉 React.js 在端口 8080 上启动服务器。

修改 package.json 文件

要使用定义的环境变量，我们需要修改 package.json 文件。在 package.json 文件中，添加以下内容：

"scripts": {
  "start": "PORT=$PORT react-scripts start"
}

这告诉 React.js 使用定义的端口启动服务器。

运行应用程序

现在，您可以通过运行以下命令来启动 React.js 应用程序，它将在定义的端口上启动服务器：

npm start

你也可以使用 yarn 来运行：

yarn start

现在，React.js 应用程序会在定义的端口上启动服务器。

总结

这篇文章向您介绍了如何在 React.js 中更改服务器的端口。通过创建环境变量和修改 package.json 文件，您可以轻松地更改服务器的端口。如果您想要更多关于 React.js 或 Web 开发的帮助，请参阅相关的文档。