我正在尝试弄清楚如何使用不同的配置文件运行 react 应用程序(通过 create-react-app 创建)。
也就是说，假设我有多个环境(本地、开发、产品)，并且我有一个引用后端(部署在另一台服务器上)的 fetch。每个环境的后端都有自己的地址。我需要以某种方式为不同的启动设置全局变量。
例如，在 Springboot 中，这可以通过 application-"profile".properties 来完成。
我通过 npm install -gserve &serve -s build 运行应用程序。怎么做？
最佳答案
使用create-react-app时，您可以使用环境变量配置您的应用程序。
这里的文档中有详细解释:https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables
所有环境变量都需要以 REACT_APP_ 为前缀。
您可以使用 .env 文件定义具有不同环境变量的配置文件。
例如，要在生产中设置 API URL，请创建一个包含以下内容的文件 .env.product:
REACT_APP_API_URL=https://my.beautiful.api/
...默认情况下(用于本地开发)，创建一个文件 .env:
REACT_APP_API_URL=http://localhost:3001/
- 当您使用
npm run build构建项目时，将使用 .env.product 文件中的环境变量 - 当您使用
npm start在本地开发模式下处理项目时，将使用 .env 文件中的环境变量
在应用代码中使用环境变量的示例:
fetch(process.env.REACT_APP_API_URL)
.then(function(response) {
return response.json();
})
.then(function(myJson) {
console.log(JSON.stringify(myJson));
});
关于reactjs - React 中的配置文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53557373/