Fixing babel-plugin-add-module-exports in Webpack 2

index.md

babel-plugin-add-module-exports generates an incorrect bundle if you use ES modules in the latest versions of Webpack 2 (at least in 2.1.0-beta.27 and .28). Here’s what to do.

1. Remove the plugin:

{
  "plugins": [
-   "add-module-exports"
  ]
}

2. Then:

Either document default as a part of your public API (e.g. redux-thunk did so):

If you use Redux Thunk 2.x in CommonJS environment, don’t forget to add .default to your import:

- var ReduxThunk = require('redux-thunk')
+ var ReduxThunk = require('redux-thunk').default

Or use module.exports when exporting your public entry point:

- export default ReduxThunk;
+ module.exports = ReduxThunk;

Update 16 Dec 2016: module is going to become undefined in ES Modules in the stable release of Webpack 2.2. To work around this, you’ll have to switch your whole entry point to CommonJS imports. So either do this:

- import foo from './foo.js';
+ const foo = require('./foo.js');
...
- export default bar;
+ module.exports = bar;

or create a sepatare CommonJS entry point for Webpack:

+ module.exports = require('./index.js').default;

Follow me on Twitter: @iamakulov