javascript - 如何编辑开发和生产环境变量？

Question

我想在 Heroku 上部署 React 应用程序 + Node 服务器，

我看到如果你使用create-react-app，你可以使用process.env.NODE_ENV来知道你是在开发还是在生产中，但我总是得到“开发”，它不起作用，所以我试过这个:

.env

REACT_APP_ENV=dev

在 React 应用程序中，我尝试控制台记录变量，但它仍然处于未定义状态

console.log("env ", process.env.REACT_APP_ENV); <-- output: undefined

但是在服务器中，控制台日志是正确的，

if (process.env.REACT_APP_ENV === "prod") {
  app.use(express.static("build"));
  app.get("*", (req, res) => res.sendFile(path.resolve("build", "index.html")));
} else if (process.env.REACT_APP_ENV === "dev") {
  console.log("ENV ", process.env.REACT_APP_ENV); <-- output: "dev"
}

当我在生产中时，在“prod”处以及在开发中的“dev”处拥有变量的最简单方法是什么？

谢谢

Answer 1

根据您所写的内容，我的理解是您正在尝试使用与 .env.development 和 .env.Production 中相同的环境变量。 dotenv 包检查的默认路径是 path.resolve(process.cwd(), '.env');所以，你需要改变它:

const env = process.env.NODE_ENV || 'development'; // if nothing is given, set it as development.
require("dotenv").config({ path: path.resolve(__dirname, `.env.${env}`) });
// ^ do checks to make sure that random env vars are not written

现在，当您运行脚本时，您需要通过附加环境变量来运行它:

NODE_ENV=development nodemon server.js
NODE_ENV=production nodemon server.js

因此，dotenv 将分别读取 .env.development 和 .env.Production。 CRA 默认执行此操作，it is not overridable :

npm start -> development
npm start -> production

您对此无能为力(也许可以弹出，但不需要这样做)。只需在脚本中添加环境变量即可:

"scripts": {
  "server:dev": "NODE_ENV=development nodemon server.js",
  "start": "concurrently \"npm run server:dev\" \"npm run client\"",
  "server:prod": "NODE_ENV=production nodemon server.js",
  ...
}

<小时/>

我还想提一下，这在开发环境中可能有用，可以查看生产应用程序如何可见；然而，在大多数情况下，这些变量应该在构建/平台环境中设置。例如，CI工具应将环境变量设置为生产；这样，您就可以在临时服务器中看到您的网站。我建议您仅在开发环境中运行生产脚本 server:prod 并创建另一个可以普遍运行的脚本，而无需手动显示环境变量。

编辑:更改了一些脚本的名称并添加了环境变量的development后备。