@babel/plugin-transform-modules-commonjs
Advanced tools
Package description
The @babel/plugin-transform-modules-commonjs npm package is a Babel plugin that transforms ECMAScript modules to CommonJS modules. This is useful for enabling code written using ES6 module syntax to run in environments that only support CommonJS modules, such as older versions of Node.js or browsers without ES6 module support.
Transform ES6 import statements to CommonJS require
Converts ES6 import statements into CommonJS require calls.
import { square } from './math';
console.log(square(5));
// Transformed code:
var _math = require('./math');
console.log(_math.square(5));Transform ES6 export statements to CommonJS exports
Converts ES6 named and default export statements into CommonJS module.exports assignments.
export const square = (n) => n * n;
export default square;
// Transformed code:
const square = (n) => n * n;
exports.square = square;
exports.default = square;Interoperability with Babel's module interop helpers
Ensures compatibility with Babel's interopRequireDefault helper to handle default exports when importing modules.
import square from './math';
console.log(square(5));
// Transformed code with interopRequireDefault helper:
var _math = _interopRequireDefault(require('./math'));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
console.log(_math.default(5));The 'esm' package is a lightweight runtime that allows you to load ES modules in Node.js. It differs from @babel/plugin-transform-modules-commonjs in that it doesn't require a build step and can directly execute ES modules in Node.js.
The '@rollup/plugin-commonjs' package is a plugin for Rollup that converts CommonJS modules into ES6 modules that Rollup can then bundle. It serves a similar purpose but is specific to the Rollup bundler, whereas @babel/plugin-transform-modules-commonjs is more general-purpose and can be used with various build tools that support Babel.
The 'babel-plugin-transform-es2015-modules-commonjs' package is an older Babel plugin that also transforms ES6 modules to CommonJS. It has been superseded by @babel/plugin-transform-modules-commonjs, which is part of the Babel 7 release.
Readme
This plugin transforms ES2015 modules to CommonJS.
In
export default 42;
Out
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = 42;
npm install --save-dev @babel/plugin-transform-modules-commonjs
.babelrc (Recommended).babelrc
// without options
{
"plugins": ["@babel/plugin-transform-modules-commonjs"]
}
// with options
{
"plugins": [
["@babel/plugin-transform-modules-commonjs", {
"allowTopLevelThis": true
}]
]
}
babel --plugins @babel/plugin-transform-modules-commonjs script.js
require("@babel/core").transform("code", {
plugins: ["@babel/plugin-transform-modules-commonjs"]
});
looseboolean, defaults to false.
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 @babel/plugin-transform-modules-commonjs
and instead of using Object.defineProperty an assignment will be used instead.
var foo = exports.foo = 5;
exports.__esModule = true;
strictboolean, defaults to false
By default, when using exports with babel a non-enumerable __esModule property
is exported. In some cases this property is used to determine if the import is the
default 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 set
the strict option to true.
noInteropboolean, defaults to false
By default, when using exports with babel a non-enumerable __esModule property
is exported. This property is then used to determine if the import is the default
export 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 the
noInterop option to true to avoid the usage of the interopRequireDefault
helper (shown in inline form above).
lazyboolean, Array<string>, or (string) => boolean, defaults to false
Changes Babel's compiled import statements to be lazily evaluated when their
imported bindings are used for the first time.
This can improve initial load time of your module because evaluating dependencies up front is sometimes entirely un-necessary. This is especially the 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 means that there is no binding to later kick off initialization.
export * from "foo"
Re-exporting all names requires up-front execution because otherwise there is no way to know what names need to be exported.
FAQs
Unknown package
We found that @babel/plugin-transform-modules-commonjs demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Cyber insurance rates are dropping as the market matures, according to a new report projecting global premiums to reach $43 billion by 2030, driven by international market uptake and growth in the SME sector.
Research
Security News
Socket researchers unpack a typosquatting package with malicious code that logs keystrokes and exfiltrates sensitive data to a remote server.
Security News
The JavaScript community has launched the e18e initiative to improve ecosystem performance by cleaning up dependency trees, speeding up critical parts of the ecosystem, and documenting lighter alternatives to established tools.