babel-plugin-feature-flags

0.3.1 verified Sat Apr 25 auth: no javascript maintenance

A Babel 6 plugin that replaces feature flag call expressions (e.g., `isEnabled('feature')`) with boolean literals based on a static configuration map. Current stable version is 0.3.1, with low release cadence. It targets Babel 6 only; Babel 5 users must use 0.2.x. Key differentiator: it works with any import name and supports 'dynamic' flags that are left untouched. Typically paired with a dead code elimination step (Uglify, etc.). No TypeScript support; no security incidents reported.

Common errors

error Error: Cannot find module 'babel-plugin-feature-flags' ↓

cause Plugin not installed or babel version mismatch (Babel 7 vs Babel 6).

fix

npm install babel-plugin-feature-flags@0.3.1 --save-dev and ensure babel-core version 6.x.

error ReferenceError: isEnabled is not defined ↓

cause The import of the feature function is not present in the source file, but the call expression is still there after transform.

fix

Add the correct import (e.g., import isEnabled from 'my-features';) matching the options.import.module.

Warnings

breaking Babel 5 support dropped in 0.3.0. Use 0.2.x for Babel 5. ↓

fix If using Babel 5, pin to 0.2.x or upgrade to Babel 6.

deprecated Babel 6 is itself deprecated. Consider upgrading to Babel 7+ with @babel/plugin-feature-flags (if available) or custom plugin. ↓

fix Migrate to Babel 7 and use equivalent plugin or inline replacement.

gotcha Feature flag values must be the exact strings 'enabled', 'disabled', or 'dynamic'. Other values (e.g., booleans) are silently ignored, leaving call expressions untransformed. ↓

fix Ensure feature values are one of the three strings.

Install

npm install babel-plugin-feature-flags

yarn add babel-plugin-feature-flags

pnpm add babel-plugin-feature-flags

Imports

babel-plugin-feature-flags

wrong

import babelPluginFeatureFlags from 'babel-plugin-feature-flags';

correct

module.exports = {
  plugins: [
    ['feature-flags', { import: { module: 'my-features' }, features: { 'new-feature': 'disabled' } }]
  ]
};

This is a Babel plugin, used in .babelrc or babel.config.js — not imported directly in source code.

default import of feature function
wrong
```
import { isEnabled } from 'my-features';
```
correct
```
import isEnabled from 'my-features';
```
The default import name is configurable via options.import.name (default is 'default'). If using a named import, set options.import.name to the export name.

feature flags configuration

wrong

{
  'my-feature': 'true',
  'beta-feature': false
}

correct

{
  'my-feature': 'enabled',
  'beta-feature': 'disabled',
  'experimental': 'dynamic'
}

Values must be exactly the strings 'enabled', 'disabled', or 'dynamic'. Booleans or other strings will not work.

Quickstart

Configures feature flags via .babelrc with enabled/disabled/dynamic values and shows transformation of flag calls.

// .babelrc
{
  "plugins": [["feature-flags", {
    "import": {
      "module": "@app/features"
    },
    "features": {
      "new-checkout": "enabled",
      "dark-mode": "disabled",
      "payment-v2": "dynamic"
    }
  }]]
}

// source.js
import feature from '@app/features';

if (feature('new-checkout')) {
  console.log('New checkout flow');
}

if (feature('dark-mode')) {
  document.body.classList.add('dark');
}

if (feature('payment-v2')) {
  // runtime check left intact
}

// after babel transform:
if (true) {
  console.log('New checkout flow');
}
// if (false) block removed by dead code elimination
if (feature('payment-v2')) {}