react.production.min.js is bundle with the library

[jeremypurser]

I'm testing out the component library in a project and when I run Webpack Analyzer, I see the the library itself has React bundled with it. I thought this was taken care of my putting it in the peerDependencies? I had also tried using the external key in the rollup config.

[jeremypurser]

I'm realizing this because the component from the library is importing React, and it must grabbing it from its own node_modules. Is this something to be resolved from the consumer side?

[HarveyD]

The peerDepsExternal should see react and react-dom are peerDeps, then prevent them from being bundled (by adding them to Rollup's external). I'm not too sure how Webpack Analyzer works... but maybe see if the component library build files aren't including react

[jeremypurser]

Thanks @HarveyD! I think on my app side during build, the import statement in the library component works it way up the tree to find the React package, and finds it in the node_modules of the library's directory. I was able to get around that by adding a resolver to my Webpack config.

[pneedham-mdsol]

@jeremypurser could you kindly share that Webpack config resolver? I believe I'm running into a similar issue (duplicate versions of React).

[jeremypurser]

@pneedham-mdsol Sure

const path = require('path')

module.exports = {
  //...
  resolve: {
    react: path.resolve(__dirname, '..', '..', 'node_modules/react')
    // Your path to React might be different
  }
};