ReactJS 环境变量在开发中未定义

Question

我无法在使用 ReactJS 的开发(本地主机)中使用我的环境变量。

我确定了以下内容:

1. 我的.env文件在根目录
2. 我的环境变量有一个前缀REACT_APP_*，用法是process.env.REACT_APP_*
3. 我的环境变量不包含 '' 和 = 以及它不包含 ; 或 , 所以定义是 REACT_APP_SOMETHING = something
4. 通过 ctrl + c 和 yarn start 多次重启服务器
5. 我检查(并复制和粘贴)了所有变量名称以确保并避免拼写错误

即使在所有这些之后，如果我尝试使用它们(例如使用 console.log(process.env.REACT_APP_SOMETHING))，它只会打印未定义的。 package.json 脚本中有什么必须要做的吗？定义只是:

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

我使用 create-react-app 来初始化我的项目。

打印例如 console.log(process.env.NODE_ENV) 工作正常。我什至尝试创建 .env.development 文件，但没有成功。

Answer 1

经过数小时的尝试、搜索和哭泣，找到了解决方案...

问题出在视觉代码中(使用 macO)。我在 Visual Code 中创建了文件 (.env)。但这(不知何故)并没有在项目文件夹中创建文件!在列出项目文件夹 (ls -a) 中的所有文件(包括隐藏的文件)后，我发现文件 .env 丢失，即使 Visual Code 正在显示该文件。

在终端内创建文件(触摸 .env)，另一个文件出现在 Visual Code 的项目文件夹中，将我所有的环境变量放入该文件后，一切开始工作。

这真的很奇怪，因为 .git 文件的创建没有问题。我为此浪费了几个小时...