javascript - 如何在 JavaScript 中使用 Netlify 的环境变量？

Question

我想使用环境变量来存储项目的 Google Analytics 跟踪 ID。我在 Netlify 上创建了一个名为“GOOGLE_ANALYTICS_ID”的环境变量。我想在我的 JavaScript 文件中使用这个变量来替换实际的跟踪 ID。

现在，我所做的只是使用“GOOGLE_ANALYTICS_ID”来调用变量。它在我的控制台中显示参考错误。

这样做的正确方法是什么？我只想将 JS 文件中的跟踪 ID 号替换为环境变量名称，以便它从 Netlify 获取值，而不是将其硬编码在文件中。

Answer 1

您应该使用process.env.GOOGLE_ANALYTICS_ID.

Answer 2

在 Netlify

1. 登录 netlify：https://app.netlify.com/teams/USERNAME/sites
2. 选择您的网站：https://app.netlify.com/sites/SITENAME/overview
3. 进入网站设置：https://app.netlify.com/sites/SITENAME/settings/general
4. 转到“构建和部署”>“环境变量”：https://app.netlify.com/sites/SITENAME/settings/deploys#environment
5. 编辑变量：
   • 钥匙：GOOGLE_ANALYTICS_ID
   • 价值：UA-XXXXXXX-X
6. 节省

我在让分析在 GatsbyJS 中工作时遇到了一些问题。有一些警告：

如果您使用的是 Gatsby：在gatsby-config.js

  plugins: [
    {
      resolve: `gatsby-plugin-google-analytics`,
      options: {
        trackingId: GOOGLE_ANALYTICS_ID,
        head: true,
        anonymize: true,
      },
    },
  ]

注意：gatsby-plugin-google-analytics 只能通过gatsby build命令启用

这意味着您无法在本地开发期间使用gatsby develop.

从插件文档：

请注意，此插件在运行时被禁用gatsby develop。这样，在您仍在开发项目时不会跟踪操作。一旦你运行gatsby build插件被启用。用gatsby serve.