reactjs - 如何使 create-react-app 构建在 0.0.0.0 而不是 localhost 上监听？

Question

我有一个 create-react-app 引导项目，我想在实例上部署。现在，我尝试了两种方法来设置部署，但最终仅设置端口而不是主机。

我的项目架构如下

Project
- Frontend
- Backend

我的主要问题是，虽然我可以在 create-react-app 构建上设置端口，但我无法将主机名设置为 0.0.0.0 而不是 localhost。

在create-react应用程序中，我在启动脚本中硬编码了HOST=0.0.0.0和PORT=443。

我尝试的另一件事是有一个脚本在端口 443 上提供页面服务。构建在端口 443 上提供服务，但不在 0.0.0.0 上提供服务。

创建react-app脚本

"scripts": {
        "start": "HOST=0.0.0.0 PORT=443 react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
    },

项目根目录下的基本脚本

"scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "client": "cd frontend && npm start",
        "client-prod": "cd frontend/build && npm install -g serve && serve -s build -l 443",
        "server": "cd backend && npm start",
        "sass": "node-sass -w frontend/source/styles/ -o frontend/source/styles/ --recursive",
        "dev": "concurrently \"npm run server\" \"npm run client\" ",
        "prod": "concurrently \"npm run server\" \"npm run client-prod\" "
    },

本地主机上的开发工作正常，但我需要能够在 0.0.0.0:443 而不是本地主机上提供我的构建页面

Answer 1

env 文件而不是项目根目录中的文件并设置 HOST=0.0.0.0，如果您还想在键入yarn 或 npm start 时禁用浏览器自动打开，您还可以设置 BROWSER=none。检查此链接以获取更多信息 https://create-react-app.dev/docs/advanced-configuration/