UI 中设置的 Netlify 环境变量在 运行 本地开发服务器时被注入为未定义

Question

我在Netlify中设置了一些环境变量UI。

看这里：

我正尝试在我的代码中使用它们，如下所示：

    console.log("AUTH0_DOMAIN:");
    console.log(process.env.AUTH0_DOMAIN);
    console.log("AUTH0_CLIENT_ID:");
    console.log(process.env.AUTH0_CLIENT_ID);
    console.log("AUTH0_AUDIENCE:");
    console.log(process.env.AUTH0_AUDIENCE);

当使用 ntl dev 启动 CLI 本地开发服务器时，看起来环境变量被注入了：

但它们都以 undefined 的形式出现，如控制台中所示：

那我做错了什么？

为什么它们以未定义的形式出现？

P.S。我知道我不应该在这里使用秘密密钥，因为它们会被暴露，但我仍然想知道如何为非秘密的东西做。

更新：将实时部署到 Netlify 后，环境变量也未定义。所以它在实时版本和开发版本上都被破坏了。

更新 2：将其分配给一个变量，如下所示，也不起作用：

const a_d = process.env.AUTH0_DOMAIN;
console.log(a_d); // This prints undefined

Answer 1

我正在构建一个 Vue 应用程序。

原来所有 Vue env variables 都需要在代码中加上 VUE_APP_ 前缀，Netlify UI.

因此，例如，它在代码中变为 const authDomain = process.env.VUE_APP_AUTH0_DOMAIN; 并且您还必须在 Netlify UI.

中使用 VUE_APP_AUTH0_DOMAIN

Answer 2

这为我解决了：

netlify link

netlify link命令会link你的本地项目到Netlify。 See docs.

我认为没有必要使用 netlify link，因为我已经安装了 Netlify CLI 并且正在使用 GitHub 自动部署我的站点，但显然这是需要的。