Can’t require() default export value in Babel 6.x

by

TL;DR

You have to use

const app = require('./app').default;
app();

Explanation

Babel 5 used to have a compatibility hack for export default: if a module contained only one export, and it was a default export, it was assigned to module.exports. So, for example, your module app.js

export default function () {}

would be transpiled to this

"use strict";

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

exports["default"] = function () {};

module.exports = exports["default"];

This was done purely for compatibility with require-ing Babel-transpiled modules (like you are doing). It was also inconsistent; if a module contained both named and default exports, it could not be require-d.

In reality, according to the ES6 module spec, a default export is no different than a named export with the name default. It is just syntactic sugar which can be statically resolved at compile time, so this

import something from './app';

is the same as this

import { default as something } from './app';

That being said, it appears that Babel 6 decided to drop the interoperability hack when transpiling modules. Now, your module app.js is transpiled as

'use strict';

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

exports.default = function () {};

As you see, no more assignment to module.exports. To require this module, you need to do

const app = require('./app').default;
app();

Or, more concisely, and closer to your original code:

require('./app').default();

More Related Contents:

  1. Unable to access React instance (this) inside event handler [duplicate]
  2. Null-safe property access (and conditional assignment) in ES6/2015
  3. Using Node.js require vs. ES6 import/export
  4. Why does babel rewrite imported function call to (0, fn)(…)?
  5. Call async/await functions in parallel
  6. Getting Unexpected Token Export
  7. Arrow Function in Object Literal [duplicate]
  8. Extending built-in natives in ES6 with Babel
  9. ES6 exporting/importing in index file
  10. Browserify, Babel 6, Gulp – Unexpected token on spread operator
  11. Is there any one-line analogy in ES6 for ES5 `module.exports = require(‘./inner.js’)`?
  12. Why doesn’t instanceof work on instances of Error subclasses under babel-node?
  13. Convert ES6 Iterable to Array
  14. SyntaxError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’ – Gulp
  15. Extending Error in Javascript with ES6 syntax & Babel
  16. Webpack babel 6 ES6 decorators
  17. Unable to use Arrow functions inside React component class [duplicate]
  18. How to publish a module written in ES6 to NPM?
  19. ES6 `export * from import`?
  20. Clean way to keep original variable and destructure at the same time
  21. JavaScript object destructuring and aliasing
  22. Difference between import X and import * as X in node.js (ES6 / Babel)?
  23. Export multiple classes in ES6 modules
  24. “unexpected token import” in Nodejs5 and babel?
  25. How to run Node.js app with ES6 features enabled?
  26. require(‘babel/register’) doesn’t work
  27. Re-export default in ES 6 modules
  28. gulp babel, exports is not defined
  29. Exporting functions with reactjs and babel
  30. How to update nested state properties in React

Leave a Comment