构建网站时如何使用不同的配置 (gatsby build)

Question

我使用 gatsbyJS 和 prismic.io 作为无头 CMS 构建了一个静态网站。有谁知道在构建网站时如何使用不同的配置（gatsby build）（例如：gatsby config 1 / gatsby config 2）。最终目标是使用 Jenkins 自动构建具有相同代码库但不同 css/config.

的不同站点

Answer 1

嗯，它并不完全使用“不同的 gatsby-config.js”文件，但最相似的方法是使用 environment variables。这将允许您使用相同的 gatsby-config.js 和不同的设置。

Gatsby 默认使用 development 和 production 作为环境，当分别为运行 gatsby develop 和 gatsby build 时（您可以根据需要使用您的自定义环境）。这样，您需要告诉 Gatsby 这些变量在哪里设置。这是通过以下代码片段（在 gatsby-config.js 中）完成的：

require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`,
})

如果您在项目的根目录下创建 .env.development 和 .env.production，您只需执行以下操作：

GATSBY_API_URL=https://example.com/api
API_KEY=927349872349798

现在，在任何配置参数中，您都可以使用存储在这些文件中的环境变量，例如：

module.exports = {
  plugins: [
    {
      resolve: `gatsby-source-patronus`,
      options: {
        apiKey: process.env.API_KEY,
      },
    },
  ],
}

扩展此行为，您可以自定义运行命令以使用不同的环境文件，例如 .env.siteOne 和 .env.siteTwo，只需在 package.json 中更改和创建您自己的脚本并使用 GATSBY_ACTIVE_ENV 变量：

 "scripts": {
    "build-site-one": "GATSBY_ACTIVE_ENV=siteOne gatsby build",
    "build-site-two": "GATSBY_ACTIVE_ENV=siteTwo gatsby build",
  },

就运行:

 npm run build-site-one

您将获取存储在 .env.siteOne 文件中的环境变量，以便您可以指向不同的 CMS 配置、不同的主题、不同的路由和路径等。

免责声明：整个过程旨在使用服务器端变量来改变一些configuration/parameters。要使用客户端 (JavaScript) 变量，您可以省略 require("dotenv").config({ path: `.env.${process.env.NODE_ENV}`}) 部分。

构建网站时如何使用不同的配置 (gatsby build)

How can you use different configs when you build a website (gatsby build)

jenkins

gatsby

prismic.io