Skip to content

Latest commit

 

History

History
83 lines (57 loc) · 6.12 KB

README.md

File metadata and controls

83 lines (57 loc) · 6.12 KB
Raw

Woah, what's going on here?

A monorepo, muhahahahahaha. See the monorepo design doc for reasoning.

Core Packages

Package Version
@babel/core npm
@babel/parser npm
@babel/traverse npm
@babel/generator npm

@babel/core is the Babel compiler itself; it exposes the babel.transform method, where transformedCode = transform(src).code.

The compiler can be broken down into 3 parts:

The flow goes like this:

input string -> @babel/parser parser -> AST -> transformer[s] -> AST -> @babel/generator -> output string

Check out the babel-handbook for more information on this.

Other

Package Version
@babel/cli npm
@babel/types npm
@babel/runtime npm
@babel/register npm
@babel/template npm
@babel/helpers npm
@babel/code-frame npm
  • @babel/cli is the CLI tool that runs @babel/core and helps with outputting to a directory, a file, stdout and more (also includes @babel/node cli). Check out the docs.
  • @babel/types is used to validate, build and change AST nodes.
  • @babel/runtime is similar to the polyfill except that it doesn't modify the global scope and is to be used with @babel/plugin-transform-runtime (usually in library/plugin code). Check out the docs.
  • @babel/register is a way to automatically compile files with Babel on the fly by binding to Node.js require. Check out the docs.
  • @babel/template is a helper function that allows constructing AST nodes from a string presentation of the code; this eliminates the tedium of using @babel/types for building AST nodes.
  • @babel/helpers is a set of pre-made @babel/template functions that are used in some Babel plugins.
  • @babel/code-frame is a standalone package used to generate errors that print the source code and point to error locations.

Presets

After Babel 6, the default transforms were removed; if you don't specify any plugins/presets, Babel will just return the original source code.

The transformer[s] used in Babel are the independent pieces of code that transform specific things. For example: the es2015-arrow-functions transform specifically changes arrow functions into regular functions. A preset is simply an array of plugins that make it easier to run a whole a set of transforms without specifying each one manually.

Package Version Description
@babel/preset-env npm automatically determines plugins and polyfills you need based on your supported environments

You can find community maintained presets on npm

Plugins

Plugins are the heart of Babel and what make it work.

You can find community plugins on npm.

Transform Plugins

There are many kinds of plugins: ones that convert ES6/ES2015 to ES5, transform to ES3, minification, JSX, flow, experimental features, and more. Check out our website for more.

Syntax Plugins

These just enable the transform plugins to be able to parse certain features (the transform plugins already include the syntax plugins so you don't need both): @babel/plugin-syntax-x. Check out our website for more.

Helpers

These are mostly for internal use in various plugins: @babel/helper-x.