如果缺少环境变量，则使Gatsby构建失败

Question

我尝试过使用.env.development和.env.production文件添加环境变量到我的Gatsby项目中，并且效果很好。

我想在环境变量缺失时使构建失败，但是似乎找不到如何启用这个功能。

我已经阅读了Gatsby环境变量文档，但似乎看不出它如何工作？这是否可行？

我相信它在内部使用dotenv/webpack定义插件。

- harveyives

Answer 1

我相信还有其他方法可以做到这一点，但经过一些快速的测试，这种方法对我来说似乎运作良好。

在你的 gatsby-config.js 文件中，你可以选择显式地引入 dotenv，这样你就可以在配置中使用那些环境变量。

我添加了以下内容，现在只要指定的环境变量不存在，Gatsby 构建就会失败。

// Load the environment variables, per
// https://www.gatsbyjs.org/docs/environment-variables/#server-side-nodejs
require('dotenv').config({
  path: `.env.${process.env.NODE_ENV}`,
})

function checkEnv(envName) {
  if (typeof process.env[envName] === 'undefined' || process.env[envName] === '') {
    throw `Missing required environment variables: ${envName}`
  }
}

try {
  checkEnv('NODE_ENV')
  checkEnv('EXAMPLE_MISSING_ENV')
  checkEnv('EXAMPLE_API_KEY')
} catch (e) {
  throw new Error(e)
}

// The rest of the config file

我可以想象进一步定制化，例如对于具有回退选项的变量记录警告，而对于由您的内容源插件或主题要求的变量抛出错误。希望这作为一个起点有所帮助！

- kennethormandy

---

这对于告知未来的开发人员构建项目所需的数据非常方便 :) - Timmah

Answer 2

我在gatsby-node.ts文件的onPreInit生命周期钩子中添加了环境检查：

const envVariablesList = [
  "ENV1",
  "ENV2",
  "ENV3",

];

function envVarChecker(vars: string[]): string | undefined {
  return vars.find(
    (item) => process.env[item] === undefined || process.env[item] === ""
  );
}

export const onPreInit: GatsbyNode["onPreInit"] = ({ actions }) => {
  const emptyEnv = envVarChecker(envVariablesList);
  if (emptyEnv !== undefined) {
    throw new Error(`Env variable: ${emptyEnv} is empty!`);
  }
};

如果任何一个声明的变量缺失，在构建过程的早期阶段（预引导阶段）就会失败。

- pwnzk

Answer 3

我无法在 Gatsby 中找到内置的解决方案。您可以手动完成，但仍然不太容易。

第一个问题：如果您希望在运行 npm 脚本时从文件加载环境，则无法立即加载。但是您可以触发一个脚本文件，在检查之前加载这些环境变量。

假设位于项目根目录的 build.sh：

source ./.env.development # this line will set env variables
if [ "$API_KEY" = 927349872349798 ] ; then
  npm run build
fi

另一个问题出现了；一些开发人员可能希望在Windows上运行它。因此最好使用著名的cross-env包。

npm i cross-env

然后一切准备就绪，添加你的secure-build：

  "scripts": {
    "build": "gatsby build",
    "develop": "gatsby develop",
    "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "clean": "gatsby clean",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1",
    "secure-build": "cross-env-shell \"./build.sh\""
  },

运行它：

npm run secure-build

这个解决方案对我来说似乎太复杂了，因为我们需要创建一个 build.sh 并安装一个新的包。也许有更简洁的解决方案。毕竟我不是 Gatsby 大师。

- Kerem atam