RollupJS ES6 module can't get imported because of default not found for redux and redux-form

Question

I have made a package for my login form that use react-redux and redux-form.

Both react-redux and redux-form are peer dependencies.

• During the build of my rollup, I don't have any error message.

• When I try to import my package into a project I have:

WARNING in ./node_modules/login-form/dist/login-form.es.js 7455:22-33 "export 'default' (imported as '_reactRedux') was not found in 'react-redux'

WARNING in ./node_modules/login-form/dist/login-form.es.js 7505:17-23 "export 'default' (imported as '_redux') was not found in 'redux'

I have never imported myself redux in my login form project.

• This is how I imported redux-form in my project:

  import { Field, reduxForm } from 'redux-form/immutable';
  

This was bundled by rollup and that was present in my es module :

import _reactRedux from 'react-redux';
import _redux from 'redux';

I must have done something wrong, but I don't know what.

This is the list of my rollup dependencies

"rollup": "^0.50.0",
"rollup-plugin-babel": "^3.0.2",
"rollup-plugin-cleanup": "^1.0.1",
"rollup-plugin-commonjs": "^8.2.1",
"rollup-plugin-inject": "^2.0.0",
"rollup-plugin-json": "^2.3.0",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-replace": "^2.0.0",
"rollup-plugin-uglify": "^2.0.1",
"rollup-plugin-visualizer": "^0.3.1",
"rollup-watch": "^4.3.1",

Answer 1

If you are using version 5.0.0+ you need to add the following in your config:

commonjs({
  namedExports: {
    // left-hand side can be an absolute path, a path
    // relative to the current directory, or the name
    // of a module in node_modules
    'node_modules/my-lib/index.js': [ 'named' ]
  }
})

Answer 2

Seems to be tied to the version of the commonjs package used / when this issue was raised.

In my case I used the latest version of @rollup/plugin-commonjs and namedExports are handled automatically.

I understand that since then the packages have been namespaced under @rollup.