Skip to content

😎A list of awesome Babel plugins, presets, etc.

License

Notifications You must be signed in to change notification settings

babel/awesome-babel

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

79 Commits
 
 
 
 
 
 

Repository files navigation

Awesome Babel Awesome

babel

A list of awesome Babel plugins, presets, etc. Many of these are from the community, but some are lesser-known plugins in the Babel organization that may be useful to you.

As always, use caution when trying out Babel plugins, especially those marked as 🔧 experimental or 🔧🚧 under construction.

If you want to contribute, please read the contribution guidelines.

Parsers

  • babel-eslint - ESLint using Babel as the parser.
    • Note: ESLint now lints most ES6+ syntax. This parser is only necessary if you are using Flow types or other experimental features.

Plugins

General Plugins

  • external-helpers - Moves helper functions to a single imported module.
  • fast-async - Uses nodent to compile async/await to fast Promise output.
  • feature-flags - Helper for managing application feature flags.
  • idx - library + babel plugin for a existential function.
  • transform-builtin-extend - Enable extending builtin types like Error and Array, which require special treatment and require static analysis to detect.
  • console-source - Prepends the file name and line numbers for all console commands
  • version - Babel plugin replace defined identifier __VERSION__ to pkg.version.
  • babel-plugin-debug-tools Babeljs Debug Tools helps you insert debug code and easely remove it when deploy to production

Module Resolution

  • lodash - Cherry-picks Lodash modules so you don’t have to.
  • ramda - Cherry-picks Ramda modules so you don’t have to.
  • module-resolver - Custom module resolver.
  • root-import - Import modules from the root with require('~/foo') syntax.
  • webpack-alias - Allows you to use webpack aliases and most of webpack resolve features in Babel.
  • hash-resolve - Allows you to use require('#/path') instead of require('../../path'), the number of ../ needed is worked out by the plugin
  • rewrite-module-path - Rewrite module resolving path.

React

Internationalization

  • c-3po - Localization tool based on es6 template literals.
  • react-intl - Extracts string messages for translation from modules that use React Intl.
  • localize - Modify static jsx text and string attributes with function call. 🔧

Types

Testing

  • espower - Annotates call sites for descriptive messages when using power-assert.
  • istanbul - Instruments your code with Istanbul coverage.
  • rewire - Adds the ability to rewire module dependencies. This enables to mock modules for testing purposes.

Optimization

Syntax Sugar

  • implicit-return - Transforms last statement in a function block to a return statement.
  • transform-iota - Golang-style iota(). 🔧
  • offside-js - Coffeescript-like indented block syntax hack. 🔧🚧
  • trace - Syntax shortcuts for console logging.
  • meaningful-logs - Adds file name and line number of caller to console.log() calls.
  • implicit-function - Implicit functions via ~ operator, transforming, for example, ~x in () => x.
  • function-composition - Function piping and composition via & operator, for example, toUpper & console.log.
  • auto-await - Automatically await every Promise in async functions.

Alternative Programming Paradigms

  • macros - Hygienic, non-syntactic macros. 🔧
  • contracts - Design by Contract; Includes preconditions, postconditions, and invariant conditions.
  • transform-scala-lambda - Enable Scala-style lambdas (using _). 🔧
  • partial-application - Scala/Kotlin-esque partial application syntax for JavaScript (using _). 🔧
  • overload - Allow overloading default operators like + or === for specific classes. 🔧🚧
  • babel-macros - Enables zero-config, importable babel plugins.
  • holes - Holes (like Scala and Elixir) to help point-free programming, using operators as functions. 🔧

Presets

  • env - The recommended preset which includes transforms based on the specified environment (browsers, node, electron, etc).
  • React - Babel preset for all React plugins.
  • React Optimize - A Babel preset and plugins for optimizing React code.

Tooling

License

CC0