环境变量在生产中不起作用

Question

我是 env 的新手，我刚刚研究了“How to add custom env to React projects”。我按照描述的步骤进行操作，并且在开发过程中发挥了作用。但是，当我尝试在 Vercel 中打开网站并查看控制台时，它返回 undefined。
这是我的 .env:

REACT_APP_NOT_SECRET_CODE=abcdef

App.js:

useEffect(() => {
 abcd();
 console.log(process.env.REACT_APP_NOT_SECRET_CODE);
}, []);

envTest.js:

console.log(process.env.REACT_APP_NOT_SECRET_CODE);

export default function abcd() {
  console.log(process.env.REACT_APP_NOT_SECRET_CODE);
}

所有这些都已准备好进行开发，但在生产中却失败了。

非常感谢任何帮助！
谢谢！

Answer 1

您需要直接在 Vercel 中定义环境变量以进行生产（构建项目时，出于安全原因，它不会复制您的 .env 文件）。

为此：

1. 登录到 Vercel
2. 转到您的项目
3. 查看项目设置
4. 转到环境变量
5. 添加你需要的

更多信息here