babel-plugin-dotenv-import

Load environment variables using import statements.

CI

Installation

$ npm install babel-plugin-dotenv-import

Usage

.babelrc

{
  "plugins": [
    ["dotenv-import", {
      "moduleName": "@env",
      "path": ".env",
      "blacklist": null,
      "whitelist": null,
      "safe": false,
      "allowUndefined": false
    }]
  ]
}

.env

API_URL=https://api.example.org
API_TOKEN=

In users.js

import {API_URL, API_TOKEN} from "@env"

fetch(`${API_URL}/users`, {
  headers: {
    'Authorization': `Bearer ${API_TOKEN}`
  }
})

The .env file

The .env file must be explicitly specified when using safe: true, otherwise it can be set in your .babelrc using path or using the environment variable ENV_FILE, for example on the command line:

ENV_FILE=.env.release node src/index.js

If the .env file is not specified using path, only previously defined environment variables will be available.

White and black lists

It is possible to limit the scope of env variables that will be imported by specifying a whitelist and/or a blacklist as an array of strings.

{
  "plugins": [
    ["dotenv-import", {
      "blacklist": [
        "GITHUB_TOKEN"
      ]
    }]
  ]
}

{
  "plugins": [
    ["dotenv-import", {
      "whitelist": [
        "API_URL",
        "API_TOKEN"
      ]
    }]
  ]
}

Safe mode

Enable safe mode to only allow environment variables defined in the .env file. This will completely ignore everything that is already defined in the environment.

The .env file has to exist.

{
  "plugins": [
    ["dotenv-import", {
      "safe": true
    }]
  ]
}

Allow undefined

Allow importing undefined variables, their value will be undefined.

{
  "plugins": [
    ["dotenv-import", {
      "allowUndefined": true
    }]
  ]
}

import {UNDEFINED_VAR} from '@env'

console.log(UNDEFINED_VAR === undefined) // true

When false (default behavior), an error will be thrown.

Caveats

When using with babel-loader with caching enabled you will run into issues where environment changes won’t be picked up. This is due to the fact that babel-loader computes a cacheIdentifier that does not take your environment into account.

You can easily clear the cache:

rm -rf node_modules/.cache/babel-loader/*

Or you can override the default cacheIdentifier to include some of your environment variables.

Credits

Based on David Chang’s works on babel-plugin-dotenv.

Miscellaneous

    ╚⊙ ⊙╝
  ╚═(███)═╝
 ╚═(███)═╝
╚═(███)═╝
 ╚═(███)═╝
  ╚═(███)═╝
   ╚═(███)═╝