如何查看react项目端口

查看 React 项目运行端口的方法

方法一：检查启动命令或配置文件
React 项目通常通过 package.json 中的 scripts 字段定义启动命令。默认情况下，开发服务器会使用 3000 端口。检查 scripts 部分是否有类似以下内容：

"start": "react-scripts start"

若需修改端口，可在启动时指定环境变量：

PORT=4000 npm start

方法二：查看终端输出
运行 npm start 后，终端会显示开发服务器的访问地址，通常包含端口信息。例如：

Compiled successfully!
You can now view my-app in the browser.
  Local:            http://localhost:3000
  On Your Network:  http://192.168.1.100:3000

方法三：检查 node_modules/.cache
React 开发服务器可能将端口信息缓存于 node_modules/.cache 目录下的文件中。但此方法不推荐直接操作，优先参考终端输出。

方法四：自定义端口配置文件
在项目根目录创建 .env 文件，添加以下内容以固定端口：

PORT=4000

重启项目后，将使用该端口。

注意事项

• 若端口被占用，开发服务器会自动尝试其他端口（如 3001、3002 等），终端会显示实际使用的端口。
• 生产环境部署时，端口由服务器（如 Nginx、Apache）或托管平台（如 Vercel）配置，需检查对应服务的设置。