1

我正在使用 create-react-app、Travis CI 和 netlify。我有一个如下所示的配置文件:

require('dotenv').load();

module.exports = {
    API_BASE_URL: process.env.REACT_APP_DATABASE_URL || 'http://localhost:8080'
} 

当我尝试部署到 Netlify 时,我在 Travis 中收到此错误:

Creating an optimized production build...
Failed to compile.
Failed to minify the code from this file: 
    ./node_modules/dotenv/lib/main.js:23 

如果我删除 require('dotenv').load(); 部分,它加载,但随后应用程序尝试转到本地主机,这显然不是我想要的。

本文:https ://github.com/motdotla/dotenv/issues/261

提出了同样的问题,但他们没有提供解决方案。我被困住了。帮助!

4

1 回答 1

4

免责声明:我为 netlify 工作。

TL;DR unix shell 使事情复杂化。

在 Netlify 中使用环境变量的首选方法是在我们的环境中设置它们 - 在构建环境变量配置小部件中(第二个在“构建和部署设置”页面 - 在您的 repo+build 命令部分下),或通过netlify.toml ( https://www.netlify.com/docs/continuous-deployment/#deploy-contexts )。后者更灵活一点,因为您可以为不同的上下文设置不同的值 - 例如,登台使用登台 DATABASE_URL,生产使用生产的。

所以 - 这些变量在构建环境中是“可用的” - 如果你的构建命令是env,那么你会看到它们 - 除了 $PATH 和 $NODE_VERSION 以及 Netlify 自动设置的其他一些东西。但是,根据构建管道的工作方式,它们可能在其中可用或不可用。如果您的构建命令是node -p "process.env"- 这将向您显示节点看到的环境变量 - 并且应该显示与显示相同的内容env(这是构建脚本运行的 shell 所看到的)。

不幸的是,人们使用的许多构建管道不会自动从父 shell 导入/继承变量。该线程显示了这样一个示例: https ://github.com/theintern/intern/issues/136#issue-26148596 。所以 - 最好的做法不是一定要使用像 dotenv 之类的东西(尽管这对那些不想缩小它的人有用:)) - 而是使用适当地传递我们在shell,进入构建环境。你如何做到这一点取决于你和你的工具。

进一步的 PS:除非您的构建管道对环境变量进行了某些操作 - 它在发布并提供给浏览器的代码中不会有太大用处 - 这不明白$REACT_APP_DATABASE_URL- 这只是浏览器的一个字符串。我知道您并没有尝试这样做,而是想为以后可能会看到此答案的人们指出这一点-这是静态站点的新开发人员之间的常见误解。

于 2018-02-21T18:59:55.753 回答