问题描述
我有一个 GatsbyJS 应用程序,它由 NodeJS express 服务器使用 gatsby-plugin-nodejs
提供服务。我在 Cloud Foundry 中设置了一个 env 变量为 GATSBY_MY_ENVIRONMENT="Production"。
我的 NodeJS 正在使用 express 并且具有以下代码。
const express = require('express');
const app = express();
const gatsby = require("gatsby-plugin-nodejs")
const cfenv = require('cfenv');
const appEnv = cfenv.getAppEnv();
require('dotenv').config()
...
gatsby.prepare({ app },() => {})
app.listen(appEnv.port,'0.0.0.0',function () {
console.log("server starting on " + appEnv.url);
console.log("My Gatsby env variable " + process.env.GATSBY_MY_ENVIRONMENT);
});
我可以在 NodeJs express 中使用 console.log(process.env.GATSBY_MY_ENVIRONMENT)
控制台记录我的变量值 - Production,但我无法在 Gatsby 组件中获取此值。
require("dotenv").config({
path: `.env.${process.env.NODE_ENV}`,})
如何在构建时访问 GatsbyJS 组件中的这个变量?我试图访问这个变量的组件可能看起来像
import React from 'react';
import Header from 'gatsby-theme-carbon/src/components/Header';
export default class MyComponent extends React.Component {
render() {
return (
<div>
My environment is {process.env.GATSBY_MY_ENVIRONMENT}
</div>
)
}
}
解决方法
您是否尝试过使用 webpack 的 DefinePlugin
使您的环境变量在您的应用中可用?
有关 accessing environment variables in JavaScript 的详细信息
这意味着添加一个 gatsby-node.js
- 或者如果您已经使用它,则对其进行编辑 (details):
exports.onCreateWebpackConfig = ({
plugins,actions,}) => {
actions.setWebpackConfig({
plugins: [
plugins.define({
MY_FANCY_VARIABLE: 'the-value',}),],})
}