ReactJS 环境变量在开发时未定义答案

【问题标题】：ReactJS Environment variables are undefined on developmentReactJS 环境变量在开发时未定义
【发布时间】：2021-12-20 10:33:45
【问题描述】：

我无法通过 ReactJS 在我的开发（本地主机）上使用我的环境变量。

我确定了以下几点：

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

即使在这一切之后，如果我尝试使用它们（例如使用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 文件，但没有成功。

【问题讨论】：

标签： reactjs environment-variables localhost create-react-app react-scripts

【解决方案1】：

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

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

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

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

【讨论】：