All Projects → dosentmatter → Babel Plugin Const Enum

dosentmatter / Babel Plugin Const Enum

Licence: mit
Transform TypeScript `const` enums

Programming Languages

javascript
184084 projects - #8 most used programming language
typescript
32286 projects
enum
40 projects

Projects that are alternatives of or similar to Babel Plugin Const Enum

minifier
Middleware to minify Html, CSS and Javascript responses
Stars: ✭ 15 (-60.53%)
Mutual labels:  minify, compress
Html Minifier Terser
actively maintained fork of html-minifier - minify HTML, CSS and JS code using terser - supports ES6 code
Stars: ✭ 106 (+178.95%)
Mutual labels:  minify, compress
LaraOutPress
This is simply compress your final out of Larvel Application and serve to the browser.
Stars: ✭ 56 (+47.37%)
Mutual labels:  minify, compress
Tiny Html Minifier
Minify HTML in PHP with just a single class
Stars: ✭ 114 (+200%)
Mutual labels:  minify, compress
csso-webpack-plugin
CSSO full restructuring minification files to serve your webpack bundles
Stars: ✭ 104 (+173.68%)
Mutual labels:  minify, compress
Lyo
📦 Node.js to browser - The easy way
Stars: ✭ 624 (+1542.11%)
Mutual labels:  minify
Babel Plugin Transform React Remove Prop Types
Remove unnecessary React propTypes from the production build. 🎈
Stars: ✭ 890 (+2242.11%)
Mutual labels:  babel-plugin
Packem
📦⚡ A precompiled JavaScript module bundler
Stars: ✭ 586 (+1442.11%)
Mutual labels:  minify
Kneden
Transpile ES2017 async/await to vanilla ES6 Promise chains: a Babel plugin
Stars: ✭ 517 (+1260.53%)
Mutual labels:  babel-plugin
Pg Minify
Minifies PostgreSQL scripts.
Stars: ✭ 37 (-2.63%)
Mutual labels:  minify
Babel Plugin Jsx Two Way Binding
🍺 A two-way data binding solution for React
Stars: ✭ 15 (-60.53%)
Mutual labels:  babel-plugin
Instantbootstrap
Instant Bootstrap is a quick and easy way to start creating bootstrap themes using LESS, SASS, GRUNT, and BOWER.
Stars: ✭ 5 (-86.84%)
Mutual labels:  minify
Leanify
lightweight lossless file minifier/optimizer
Stars: ✭ 694 (+1726.32%)
Mutual labels:  minify
Gulp Boilerplate
A boilerplate for building web projects with Gulp.js.
Stars: ✭ 840 (+2110.53%)
Mutual labels:  minify
Uglifier
Ruby wrapper for UglifyJS JavaScript compressor.
Stars: ✭ 601 (+1481.58%)
Mutual labels:  minify
Gulp Tar
Create tarball from files
Stars: ✭ 28 (-26.32%)
Mutual labels:  compress
React Svg Loader
A loader for webpack, rollup, babel that loads svg as a React Component
Stars: ✭ 570 (+1400%)
Mutual labels:  babel-plugin
Htm
Hyperscript Tagged Markup: JSX alternative using standard tagged templates, with compiler support.
Stars: ✭ 7,299 (+19107.89%)
Mutual labels:  babel-plugin
Babel Plugin Styled Components
Improve the debugging experience and add server-side rendering support to styled-components
Stars: ✭ 878 (+2210.53%)
Mutual labels:  babel-plugin
Flow Runtime
A runtime type system for JavaScript with full Flow compatibility.
Stars: ✭ 813 (+2039.47%)
Mutual labels:  babel-plugin

babel-plugin-const-enum · npm version npm downloads

Transform TypeScript const enums

Install

Using npm:

npm install --save-dev babel-plugin-const-enum

or using yarn:

yarn add babel-plugin-const-enum --dev

Usage

You are most likely using @babel/preset-typescript or @babel/plugin-transform-typescript as along with this plugin.

If you are using @babel/preset-typescript, then nothing special needs to be done since plugins run before presets.

If you are using @babel/plugin-transform-typescript, then make sure that babel-plugin-const-enum comes before @babel/plugin-transform-typescript in the plugin array so that babel-plugin-const-enum runs first. This plugin needs to run first to transform the const enums into code that @babel/plugin-transform-typescript allows.

.babelrc

{
  "plugins": ["const-enum", "@babel/transform-typescript"]
}

transform: removeConst (default)

Removes the const keyword to use regular enum. Can be used in a slower dev build to allow const, while prod still uses tsc. See babel#6476.

// Before:
const enum MyEnum {
  A = 1,
  B = A,
  C,
  D = C,
  E = 1,
  F,
  G = A * E,
  H = A ** B ** C,
  I = A << 20
}

// After:
enum MyEnum {
  A = 1,
  B = A,
  C,
  D = C,
  E = 1,
  F,
  G = A * E,
  H = A ** B ** C,
  I = A << 20
}

.babelrc

{
  "plugins": [
    "const-enum"
  ]
}

Or Explicitly:

.babelrc

{
  "plugins": [
    [
      "const-enum",
      {
        "transform": "removeConst"
      }
    ]
  ]
}

transform: constObject

Transforms into a const object literal. Can be further compressed using Uglify/Terser to inline enum access. See babel#8741.

// Before:
const enum MyEnum {
  A = 1,
  B = A,
  C,
  D = C,
  E = 1,
  F,
  G = A * E,
  H = A ** B ** C,
  I = A << 20
}

// After:
const MyEnum = {
  A: 1,
  B: 1,
  C: 2,
  D: 2,
  E: 1,
  F: 2,
  G: 1,
  H: 1,
  I: 1048576
};

.babelrc

{
  "plugins": [
    [
      "const-enum",
      {
        "transform": "constObject"
      }
    ]
  ]
}

Troubleshooting

SyntaxError

You may be getting a SyntaxError because you are running this plugin on non-TypeScript source. You might have run into this problem in react-native, see:
babel-plugin-const-enum#2
babel-plugin-const-enum#3

This seems to be caused by react-native transpiling flow code in node_modules. To fix this issue, please use babel-preset-const-enum to only run babel-plugin-const-enum on TypeScript files. If you wish to fix the issue manually, check out the solution in babel-plugin-const-enum#2.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].