3

我正在用 Netlify 托管的 Gridsome 和 Netlify CMS 构建一个网站。Netlify CMS 的东西位于/static/admin. 我正在手动初始化 Netlify CMS,index.js以根据环境变量更改它推送的分支。

const branch = window.GRIDSOME_CMS_BRANCH || "develop"
window.CMS_MANUAL_INIT = true
const { CMS, initCMS: init } = window

init({
    config: {
        backend: {
            branch: `${branch}`
        },
    },
})

我在netlify.toml文件中设置这些环境变量,如下所示:

[context.release.environment]
    GRIDSOME_CMS_BRANCH = "release"

[context.stage.environment]
    GRIDSOME_CMS_BRANCH = "stage"

[context.develop.environment]
    GRIDSOME_CMS_BRANCH = "develop"

但是当我构建并导航到mysite.com/admin访问 CMS 时,分支始终是develop并且环境变量是undefined. 我尝试了很多不同的东西,我想我在这种情况下对环境变量有一些基本的误解。如果有人可以帮助我并向我解释这些东西或提供可行的解决方案,我会是一个快乐的人。

在此先感谢和欢呼!

4

1 回答 1

1

我有一个类似的问题,我使用本文中描述的技术解决了 https://medium.com/@trekinbami/using-environment-variables-in-react-6b0a99d83cf5

如果您需要访问客户端的环境变量(这是初始化 Netlify CMS 的位置),您可以使用 webpack 在构建时为您存储该值。

您可以在 Netlify CMS 的 webpack 配置中执行以下操作:

const webpack = require('webpack');
const getRepoInfo = require('git-repo-info')

const { branch } = getRepoInfo()

module.exports = () => {
  return {
    plugins: [
      new webpack.DefinePlugin({
        'process.env.GRIDSOME_CMS_BRANCH': JSON.stringify(branch)
      })
    ]
  };

上面的代码在构建时在服务器上执行,但在运行时使变量process.env.GRIDSOME_CMS_BRANCH对客户端可用。

于 2020-04-03T17:46:45.263 回答