babel-plugin-conditional-compile

0.0.5 verified Sat Apr 25 auth: no javascript maintenance

A Babel plugin that performs conditional compilation by evaluating if statements with predefined constants and removing dead code. Version 0.0.5 is the latest stable release, updated infrequently (last release in 2016). It allows developers to define compile-time constants (e.g., IS_DEV, CODE_FOR_IE) and automatically eliminate unreachable branches during bundling, reducing bundle size. Unlike webpack's DefinePlugin or similar tools, this operates at the AST level within Babel transformation pipeline. Supports dropping debugger statements and arbitrary constant replacement. Lacks TypeScript definitions and ES module support; designed for legacy Babel 6.x.

Common errors

error Error: Cannot find module 'babel-core' ↓

cause Attempting to use the plugin with Babel 7+ where '@babel/core' is the package name, not 'babel-core'.

fix

Install 'babel-core' (legacy): npm install babel-core@6 --save-dev, or migrate to a plugin compatible with @babel/core.

error ReferenceError: IS_DEV is not defined ↓

cause The plugin is not configured or is not transforming the code because the define option is missing or misspelled.

fix

Ensure the plugin is listed in .babelrc. Example: { plugins: [['conditional-compile', { define: { IS_DEV: true } }]] }

error TypeError: Cannot read property 'visitor' of undefined ↓

cause Plugin is not properly installed or is being used as a function instead of a string in Babel config.

fix

Reference the plugin by its package name string in the plugins array: ['conditional-compile', options]

Warnings

deprecated Package is unmaintained since 2016 and only supports Babel 6.x (babel-core), not Babel 7+ (@babel/core). ↓

fix Use @babel/plugin-transform-conditional-compile or other modern alternatives.

gotcha The plugin does not support ES module syntax (import/export); works only with CommonJS require. ↓

fix Ensure your Babel preset is set to transform ES modules to CommonJS, or use a different plugin that supports ESM.

breaking Incorrect use of 'require('babel-plugin-conditional-compile')' at runtime will fail because the plugin is not designed to be called directly. ↓

fix Do not attempt to require the plugin yourself. Instead, specify it in .babelrc or babel.transform plugins array as a string.

gotcha Options object must be provided as second array element; omitting it causes all defines to be undefined and no code removal occurs. ↓

fix Always pass an object with define property, even if empty: plugins: [['conditional-compile', {}]]

Install

npm install babel-plugin-conditional-compile

yarn add babel-plugin-conditional-compile

pnpm add babel-plugin-conditional-compile

Imports

default
wrong
```
import conditionalCompile from 'babel-plugin-conditional-compile'
```
correct
```
// No import needed - plugin is specified in Babel config
```
This is a Babel plugin, not a module to import directly. Add it to plugins array in .babelrc or babel.transform options.
babel-core
wrong
```
import { transform } from 'babel/core'; // wrong because babel-core was the v6 package
```
correct
```
const babel = require('babel-core');
```
This plugin targets Babel 6.x, where the package is 'babel-core' (not '@babel/core'). Use require('babel-core') for compatibility.

PluginConfig

wrong

plugins: ['conditional-compile'] // no options object

correct

// Options are passed as second element in plugin array:
plugins: [['conditional-compile', { define: { IS_DEV: true } }]]

Without passing an options object, no defines will be set and the plugin becomes a no-op.

Quickstart

Demonstrates using Babel 6 with the plugin to remove dead code based on compile-time constants. Sets IS_DEV to false and CODE_FOR_CHROME to true, removing the IE branch and debug log.

const babel = require('babel-core');

const code = `
if (IS_DEV) {
  console.log('debug info');
}
var foo;
if (CODE_FOR_IE) {
  foo = 1;
} else if (CODE_FOR_CHROME) {
  foo = 2;
}
`;

const result = babel.transform(code, {
  plugins: [['babel-plugin-conditional-compile', {
    define: {
      IS_DEV: false,
      CODE_FOR_CHROME: true
    },
    dropDebugger: false
  }]]
});

console.log(result.code);
// Output:
// var foo;
// foo = 2;