如何在运行时更改React js环境属性文件（.env）

Question

目前，我正在开发一个React应用程序。我已经创建了一个.env文件，并且在所有其他页面中都使用了环境变量，但是无法在build文件夹中看到该.env文件。有什么方法可以在运行时在构建文件中更改环境变量吗？

这在手动更改主机名和端口等，然后取消构建时有效。创建构建后，有什么方法可以更改变量吗？

将提供任何帮助。

谢谢， 丽雅

Answer 1

您可以根据环境声明env.变量，并可以根据需要使用它们。如果您使用的是create-react-app，则可以制作.env.development文件进行开发，并制作.env.production文件进行生产。当您运行npm start时，它将消耗.env.development中的变量，而当您运行npm run build来生成生产包时，它将消耗.env.production中的变量。

您可以使用此命令env.

使用process.env.<variable>个变量

如果您的项目不是使用create-react-app创建的，则可以使用dotenv模块。

1. 然后将此行添加到应用require('dotenv').config()
2. 然后在根目录文件夹中创建一个env.文件，并在其中声明变量。

有关更多信息，https://www.npmjs.com/package/dotenv。

Answer 2

您的问题的答案可以在这里找到：
Create React App Docs: Adding Custom Environment Variables

  

环境变量是在构建期间嵌入的。由于Create React App会生成静态的HTML / CSS / JS捆绑包，因此它可能无法在运行时读取它们。 要在运行时阅读它们，您需要将HTML加载到服务器上的内存中，并在运行时替换占位符，就像described here一样。另外，您可以随时在服务器上重建应用程序。