开发者问题收集

如何指定端口来运行基于 create-react-app 的项目?

2016-11-21
960982

我的项目基于 create-react-app npm startyarn start 默认将在 端口 3000 上运行应用程序,并且 package.json 中没有指定端口的选项。

在这种情况下,我该如何指定我选择的端口?我想同时运行两个这个项目(用于测试),一个在端口 3005 ,另一个在 3006

3个回答

如果您不想设置 环境变量 ,另一个选项是修改 package.json 的 scripts 部分,从:

"start": "react-scripts start"

更改为

Linux (在 Ubuntu 14.04/16.04 上测试)和 MacOS (由 aswin-s 在 MacOS Sierra 10.12.4 上测试):

"start": "PORT=3006 react-scripts start"

或者(可能是)由 IsaacPak

"start": "export PORT=3006 react-scripts start"

Windows 提供的更通用的解决方案 JacobEnsor 的解决方案

"start": "set PORT=3006 && react-scripts start"

cross-env lib 可在任何地方使用。有关详细信息,请参阅 Aguinaldo Possatto 的 答案

由于我的答案很受欢迎而更新: 目前,我更喜欢使用保存在 .env 文件中的环境变量(用于以方便且可读的形式存储不同 deploy 配置的变量集)。如果您仍将机密存储在 .env 文件中,请不要忘记将 *.env 添加到 .gitignore 中。 这里 解释了为什么在大多数情况下使用环境变量更好。 这里 解释了为什么将机密存储在环境中是个坏主意。

El Ruso
2017-01-20

这是完成此任务的另一种方法。

在项目根目录下创建一个 .env 文件并在那里指定端口号。例如:

PORT=3005
Shahriar Hasan Sayeed
2017-02-14

在主目录中除了 package.json 之外还创建一个名为 .env 的文件,并将 PORT 变量设置为所需的端口号。

例如:

.env

PORT=4200

您可以在此处找到此操作的文档: https://create-react-app.dev/docs/advanced-configuration

Muhammed Ozdogan
2020-03-17