构建React App后更改可从环境文件访问的Axios baseUrl

Question

当前我正在使用.env文件放置在带有变量的react app根文件夹中

  

REACT_APP_BASE_URL = http://localhost:8081

我的用户axios默认为api请求设置基本网址

  

Axios.defaults.baseUrl = process.env.REACT_APP_BASEURL

不考虑构建React App .env文件，并且如果我更改了我的基本URL，该如何做而不重新构建整个React App。 我想使基本URL独立，因此可以动态更改基本URL。最好的解决方案是什么？

Answer 1

因此，您需要清楚地了解env变量和构建过程会发生什么。

在构建create-react-app应用程序时，构建该应用程序的过程会使用.env文件来转换代码并将其捆绑。并且输出是静态HTML，js和CSS文件。

这意味着当您提供已构建的应用程序时，该应用程序代码中已包含.env，并且在将它们发送到浏览器时没有任何可处理的内容，因此这就是您每次都需要重建的原因您想要更改环境变量

如果您使用create-react-app's .env file structure并使用.env.development文件与开发中的基本URL一起进行开发（运行yarn start时），并使用.env.production文件，则应该没有问题。生产构建的基本URL。每当您要更改服务器上的值时，只需对其进行更新并重建即可。如果您不想在git上对其进行版本控制，请改用.env.production.local