1. babel-plugin-add-module-exports
Fix babel/babel#2212
babel-plugin-add-module-exports
Package: babel-plugin-add-module-exports
Created by: 59naga
Last modified: Sun, 10 Sep 2023 02:39:03 GMT
Version: 1.0.4
License: MIT
Downloads: 4,582,760
Repository: https://github.com/59naga/babel-plugin-add-module-exports

Install

npm install babel-plugin-add-module-exports
yarn add babel-plugin-add-module-exports

babel-plugin-add-module-exports

Why?

Babel@6 doesn't export default module.exports any more - T2212 Kill CommonJS default export behavior.

Babel@6 transforms the following file

 export default 'foo'

into

 'use strict';
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = 'foo';

Therefore, it is a need to use the ugly .default in node.js.

 require('./bundle.js') // { default: 'foo' }
require('./bundle.js').default // 'foo'

This plugin follows the babel@5 behavior - add the module.exports if only the export default declaration exists.

 'use strict';
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = 'foo';
module.exports = exports['default'];

Therefore, our old codes still work fine - the .default goes away. :wink:

 require('./bundle.js') // foo

Usage

Install this plugin from npm:

 npm install babel-plugin-add-module-exports --save-dev
# or
yarn add -D babel-plugin-add-module-exports

Write the name to babelrc. It works with preset-env to output CommonJS code:

 {
  "presets": ["@babel/env"],
  "plugins": ["add-module-exports"]
}

modules: false

However, the plugin doesn't change the pure-esmodule.
this plugin makes changes only when exists exports.default (in other words, using commonjs).

 {
  "presets": [["@babel/env", { "modules": false }]],
  "plugins": ["add-module-exports"]
}

into

 export default 'foo'

1.0.0 Currently support is commonjs and umd.
Doesn't support amd, systemjs modules(don't use. there are no plans to support at the moment).

with Webpack

Likewise, webpack doesn't perform commonjs transformation for codesplitting. Need to set commonjs conversion.

 {
  "presets": [["@babel/env", { "modules": "commonjs" }]],
  "plugins": ["add-module-exports"]
}

Options

addDefaultProperty

If you're exporting an object and wish to maintain compatibility with code using the require('./bundle.js').default syntax, you can optionally enable the addDefaultProperty option as follows:

 {
  "presets": ["env"],
  "plugins": [
    [
      "add-module-exports",
      {
        "addDefaultProperty": true
      }
    ]
  ]
}

This will cause a second line of code to be added which aliases the default name to the exported object like so:

 module.exports = exports['default'];
module.exports.default = exports['default']

See also

License

MIT

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code