Breaking Change: Babel 6 Export Default Behavior

With the release of Babel 6, significant changes have been implemented in how default exports are handled. While Babel previously added the line module.exports = exports["default"], this functionality has been removed.

This modification necessitates a change in module import syntax. Previously, code using the legacy syntax:

var foo = require('./foo');
// use foo

Must now employ the following syntax:

var foo = require('./foo').default;
// use foo

While this adjustment may seem minor, it can pose a challenge for projects with significant code dependencies on the previous export mechanism.

Workaround

If the legacy export behavior is required, direct usage of CommonJS is recommended. Alternatively, a custom plugin can be used to provide the desired compatibility. This plugin's functionality would likely mirror the behavior removed in Babel 6, adding the module.exports = exports["default"] line to the transpiled output.

Impact of Named Exports

It's worth noting that the removal of the automatic module.exports assignment improves ES6 semantics and prevents potential confusion. Named exports will now behave as expected, without accidental assignments to the default export.

Example

The following code demonstrates the difference between Babel 5 and Babel 6 export behavior:

// Input
const foo = {}
export default foo

Babel 5 Output

"use strict";

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

Babel 6 Output

"use strict";

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

As can be observed, the only difference in the output is the absence of module.exports = exports["default"] in Babel 6.