Babel Plugin for TypeScript Const Enums

1.2.0 · active · verified Sun Apr 19

babel-plugin-const-enum is a Babel plugin designed to transform TypeScript `const enum` declarations. Babel's standard TypeScript presets/plugins (`@babel/preset-typescript` or `@babel/plugin-transform-typescript`) do not inherently handle `const enum`s, which are erased during TypeScript's compilation if not explicitly preserved or transformed. This plugin, currently at version 1.2.0, provides a solution by enabling two transformation strategies: `removeConst` (the default, converting `const enum`s into regular `enum`s) or `constObject` (transforming them into constant object literals). The `constObject` strategy is particularly useful for environments where minifiers like Terser or UglifyJS can then effectively inline these values, leading to smaller bundle sizes. It acts as a critical intermediary step for projects using TypeScript with Babel that rely on `const enum`s, ensuring their correct processing and optimization. The release cadence is driven by community needs and Babel ecosystem changes.

Common errors

```
SyntaxError: Unexpected token, expected "("
```
cause The `babel-plugin-const-enum` is being applied to non-TypeScript files that might contain different syntax, such as Flow annotations.

fix Ensure the plugin only runs on TypeScript files. Use `babel-preset-const-enum` or configure your Babel setup to explicitly include/exclude files based on their type (e.g., `test: /\.tsx?$/` for Webpack Babel loader).
```
ReferenceError: MyEnum is not defined
```
cause `const enum` was stripped by Babel without transformation, likely due to incorrect plugin order.

fix Verify that `babel-plugin-const-enum` is listed before `@babel/plugin-transform-typescript` in your Babel configuration. If using `@babel/preset-typescript`, ensure `babel-plugin-const-enum` is listed in the `plugins` array (plugins always run before presets).

Warnings

breaking Incorrect plugin order will cause `const enum`s to not be transformed correctly or result in syntax errors.
Fix: Ensure `babel-plugin-const-enum` is listed BEFORE `@babel/plugin-transform-typescript` in your Babel configuration's plugin array. If using `@babel/preset-typescript`, no explicit ordering is usually needed as plugins run before presets.
gotcha Running `babel-plugin-const-enum` on non-TypeScript source files (e.g., Flow-typed JavaScript in `node_modules` in React Native projects) can lead to `SyntaxError`s.
Fix: Use `babel-preset-const-enum` to apply the plugin only to TypeScript files, or manually configure your Babel loader/plugin to exclude non-TypeScript files (e.g., `exclude: /node_modules/(?!my-typescript-lib)/`).
gotcha The default `transform: removeConst` option converts `const enum`s to regular `enum`s, which may not be fully optimized by minifiers. The `transform: constObject` option provides better minification but changes the runtime shape.
Fix: If minification and bundle size are critical, configure the plugin with `["const-enum", {"transform": "constObject"}]` to convert enums into constant object literals that optimizers can inline.

Install

npm install babel-plugin-const-enum npm
yarn add babel-plugin-const-enum yarn
pnpm add babel-plugin-const-enum pnpm

Imports

const-enum
wrong:
```
{ "plugins": ["@babel/plugin-transform-typescript", "const-enum"] }
```
correct:
```
{ "plugins": ["const-enum"] }
```
Referenced as a string in Babel config. It must be listed before `@babel/plugin-transform-typescript` if using plugins directly.
const-enum with options
wrong:
```
{ "plugins": ["const-enum": {"transform": "constObject"}] }
```
correct:
```
{ "plugins": [["const-enum", {"transform": "constObject"}]] }
```
When passing options, the plugin entry must be an array where the first element is the plugin name and the second is an object of options.
babel-plugin-const-enum (require)
wrong:
```
import constEnumPlugin from 'babel-plugin-const-enum'
```
correct:
```
require('babel-plugin-const-enum')
```
If configuring Babel dynamically in `babel.config.js`, plugins are typically `require`d, not `import`ed directly as a module for application code.

Quickstart

Configures Babel to use `babel-plugin-const-enum` with `@babel/preset-typescript`, transforming `const enum`s into constant object literals for better minification.

{
  "presets": [
    [
      "@babel/preset-typescript",
      {
        "is  TSX": true, // Example option for preset-typescript
        "allExtensions": true
      }
    ]
  ],
  "plugins": [
    // Must run BEFORE @babel/preset-typescript if plugin-transform-typescript is implicitly used.
    // Or explicitly before @babel/plugin-transform-typescript if listed directly.
    ["const-enum", {"transform": "constObject"}]
  ]
}

view raw JSON →