@babel/plugin-transform-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-modules-commonjs

Usage

Via .babelrc (Recommended)

.babelrc

// without options
{
  "plugins": ["@babel/plugin-transform-modules-commonjs"]
}
// with options
{
  "plugins": [
    ["@babel/plugin-transform-modules-commonjs", {
      "allowTopLevelThis": true
    }]
  ]
}

Via CLI

babel --plugins @babel/plugin-transform-modules-commonjs script.js

Via Node API

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

Options

loose

boolean, defaults to false.

By default, when using exports with babel a non-enumerable __esModule propertyis 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 @babel/plugin-transform-modules-commonjsand instead of using Object.defineProperty an assignment will be used instead.

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

strict

boolean, defaults to false

By default, when using exports with babel a non-enumerable _esModule propertyis exported. In some cases this property is used to determine if the import _is thedefault export or if it contains the default export.

var foo = exports.foo = 5;
Object.defineProperty(exports, "__esModule", {
  value: true
});

In order to prevent the __esModule property from being exported, you can setthe strict option to true.

noInterop

boolean, defaults to false

By default, when using exports with babel a non-enumerable _esModule propertyis exported. This property is then used to determine if the import _is the defaultexport or if it contains the default export.

"use strict";
var _foo = _interopRequireDefault(require("foo"));
function _interopRequireDefault(obj) {
  return obj && obj.__esModule ? obj : { default: obj };
}

In cases where the auto-unwrapping of default is not needed, you can set thenoInterop option to true to avoid the usage of the interopRequireDefaulthelper (shown in inline form above).

lazy

boolean, Array<string>, or (string) => boolean, defaults to false

Changes Babel's compiled import statements to be lazily evaluated when theirimported bindings are used for the first time.

This can improve initial load time of your module because evaluatingdependencies up front is sometimes entirely un-necessary. This is especiallythe case when implementing a library module.

The value of lazy has a few possible effects:

• false - No lazy initialization of any imported module.

• true - Do not lazy-initialize local ./foo imports, but lazy-init foo dependencies.

Local paths are much more likely to have circular dependencies, which may break if loaded lazily,so they are not lazy by default, whereas dependencies between independent modules are rarely cyclical.

• Array<string> - Lazy-initialize all imports with source matching one of the given strings.

• (string) => boolean - Pass a callback that will be called to decide if a given source string should be lazy-loaded.

The two cases where imports can never be lazy are:

• import "foo";

Side-effect imports are automatically non-lazy since their very existence meansthat there is no binding to later kick off initialization.

• export * from "foo"

Re-exporting all names requires up-front execution because otherwise there is noway to know what names need to be exported.

You can read more about configuring plugin options here