【问题标题】：Heroku failed to load ./.envHeroku 无法加载 ./.env
【发布时间】：2020-05-02 16:09:01
【问题描述】：

我的问题

我在 Heroku 生产环境中加载环境变量时遇到问题。推送到 Heroku 时，我在构建脚本期间收到以下错误消息：

Failed to load ./.env.

当前设置

我在本地应用程序的根目录中使用.env 文件。我可以使用dotenv-webpack 插件成功加载我的环境变量，如下所示：

//webpack.config

const Dotenv = require('dotenv-webpack')
module.exports = {
  // other settings...
  
  plugins: [
    new Dotenv(),
  ]
};

加载环境变量：

//server.js

require('dotenv').config();
console.log(process.env.MY_VARIABLE);

这在本地就像一个魅力，但在 Heroku 上失败了。

注意：我的配置变量已在 Heroku 上设置，所以这不是问题。

我尝试了什么

我已经尝试从我的应用程序的根目录强制加载.env 文件，如下所示：

new Dotenv({ path: path.resolve(__dirname, './.env') });

有人还指出 Heroku 环境可能是系统范围的环境变量，所以我尝试使用以下方法加载它们：

new Dotenv({ systemVars: true });

这些尝试都不适合我。

我的猜测

我注意到 Heroku 将他们的 .env 文件保存在 ./tmp/build_someRandomBuildId/.env 下。我的猜测是 .env 文件不在目录的根目录上，因此为什么 dotenv 找不到它。也没有办法在我的 Webpack 配置中硬编码这个文件的位置，因为每次构建时构建 ID 都是随机的。有没有办法告诉 Webpack 在动态位置查找文件？

【问题讨论】：

这能回答你的问题吗？ Node JS environment variables and Heroku deployment
不是真的，在 Heroku 中设置环境变量有效，它在生产中加载它们失败了，因为 Heroku 上的 .env 文件位于动态生成的目录中，所以我不能直接指向它我的 webpack.config。不过我确实设法找到了解决方案，我下班后会在这里发布答案。不过，感谢您的宝贵时间。
“因为 Heroku 上的 .env 文件位于动态生成的目录中”——我不确定我是否理解这一点。 Heroku 上不应该有 .env 文件。 .env 文件和库（如dotenv）的全部意义在于设置环境变量，但 Heroku 的配置变量直接用于此。 .env 文件主要用于开发，不应包含在您推送的代码中。
你是对的，我误解了错误。 Webpack 正在该动态生成的目录中寻找 .env 文件。它显然没有找到它，因为没有您所说的 .env 文件。因此出现错误。

标签： heroku webpack environment-variables dotenv

【解决方案1】：

我终于找到了解决方案，把这个留给和我有同样问题的其他人。

我使用dotenv-webpack 在本地设置我的环境变量，这就像一个魅力。另一方面，Heroku 会自动设置它们的环境变量，因此无需自己设置它们。无需查找 .env 文件。我所要做的就是将我的 webpack.config 拆分为 2 个单独的文件。

//webpack.dev

require('dotenv').config();

plugins: [
  new Dotenv()
],

在本地加载 .env 文件。

//webpack.prod

require('dotenv').config();

plugins: [
  new webpack.DefinePlugin({
    'process.env': {
      'YOUR_VARIABLE': JSON.stringify(process.env.YOUR_VARIABLE),
    }
  });
]

从 Heroku 获取您的环境变量并将它们写入您自己的 process.env

【讨论】：

【解决方案2】：

今天我偶然发现了这个问题，我尝试了几种解决方案，但都没有奏效。我的应用在本地运行，但在生产模式 (heroku) 下无法正确加载 process.env。

然后我发现了这个https://www.npmjs.com/package/dotenv-webpack

//webpack.config.js
  plugins: [
      new Dotenv({ systemvars: true }),
  ],

只需将 systemvars 设置为 true 即可。现在，我已经使用 .env 文件和 heroku 仪表板的不同键对此进行了测试；它们没有连接，它们在生产或开发模式下正确替换自己。

使用包“dotenv-webpack”而不是“dotenv”。

我希望这可以为面临同样问题的人节省一些时间

【讨论】：

【解决方案3】：

如果您不使用 Webpacks，则该想法的解决方案类似于接受的答案。 Heroku 默认在“生产”模式下工作，因此如果 Heroku 中的问题出在 Dotenv 上（无论如何都不应该在 Heroku 中使用），请在生产时禁用 Dotenv，如下所示：

if (process.env.NODE_ENV !== 'production') { 
   require('dotenv').config() }
}

...然后，只需执行以下操作即可访问环境变量：

var someVar = process.env.SOME_VARIABLE;

不要忘记首先使用应用仪表板中的控制台命令行或使用 app.json 文件在 Heroku 上设置环境变量。

【讨论】：