gatsby-plugin-client-variables v1.0.0

Gatsby Client Variables Plugin

A Gatsby plugin to allow server-side runtime environment variables to be made available to client-side scripts.

By default, Gatsby only makes system environment variables prefixed with GATSBY_ available to client scripts. Using this plugin, you can make server-side runtime environment variables available within the browser i.e., env variables passed to docker container.

Install

npm install gatsby-plugin-client-variables

How to use

In gatsby-config.js:

module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-client-variables`,
      options: {
        output: "config/gatsby-client-variables.json",
      },
    },
  ],
};

Client-side:

import variables from "gatsby-plugin-client-variables";

import { API_URL } from "gatsby-plugin-client-variables";

Server-side:

const initClientVariables = require("gatsby-plugin-client-variables/server");

async function main() {
  await initClientVariables("config/gatsby-client-variables.json", {
    publicDir: "public/",
  });

  app.listen(3000, function () {
    console.log("App started on port 3000");
  });
}

main();