babel-plugin-transform-es2015-modules-commonjs

What is babel-plugin-transform-es2015-modules-commonjs?

The babel-plugin-transform-es2015-modules-commonjs npm package is a plugin for Babel that transforms ECMAScript 2015 modules to CommonJS syntax. This allows developers to write their JavaScript code using the ES2015 module syntax and then compile it down to a format that is compatible with environments that only support CommonJS modules, such as Node.js.

What are babel-plugin-transform-es2015-modules-commonjs's main functionalities?

Transform ES2015 import statements to CommonJS require

This feature allows developers to use the ES2015 import syntax and have it compiled into CommonJS require statements.

import { square } from './math';
// Transforms to:
var _math = require('./math');
var square = _math.square;

Transform ES2015 export statements to CommonJS exports

This feature enables the use of ES2015 export syntax which is then compiled into CommonJS exports.

export const square = (n) => n * n;
// Transforms to:
exports.square = (n) => n * n;

Other packages similar to babel-plugin-transform-es2015-modules-commonjs

@babel/plugin-transform-modules-commonjs

This package is the evolution of babel-plugin-transform-es2015-modules-commonjs and is maintained by the Babel team. It provides similar functionality but is updated to work with newer versions of Babel and may include additional optimizations and features.

esm

The esm package is a lightweight runtime that allows you to load ES modules in Node.js without any compilation step. It differs from babel-plugin-transform-es2015-modules-commonjs in that it doesn't transform the code but rather enables an environment where ES modules can be used natively.

README

babel-plugin-transform-es2015-modules-commonjs

This plugin transforms ES2015 modules to CommonJS.

Example

In

export default 42;

Out

Object.defineProperty(exports, "__esModule", {
  value: true
});

exports.default = 42;

Installation

npm install --save-dev babel-plugin-transform-es2015-modules-commonjs

Usage

Via .babelrc (Recommended)

.babelrc

// without options
{
  "plugins": ["transform-es2015-modules-commonjs"]
}

// with options
{
  "plugins": [
    ["transform-es2015-modules-commonjs", {
      "allowTopLevelThis": true
    }]
  ]
}

Via CLI

babel --plugins transform-es2015-modules-commonjs script.js

Via Node API

require("babel-core").transform("code", {
  plugins: ["transform-es2015-modules-commonjs"]
});

Options loose

As per the spec, import and export are only allowed to be used at the top level. When in loose mode these are allowed to be used anywhere.

And by default, when using exports with babel a non-enumerable __esModule property is exported.

var foo = exports.foo = 5;

Object.defineProperty(exports, "__esModule", {
  value: true
});

In environments that don't support this you can enable loose mode on es6.modules and instead of using Object.defineProperty an assignment will be used instead.

var foo = exports.foo = 5;
exports.__esModule = true;