1

I'm using a self made component library to share components between my projects. The problem is that even after using the Authoring libraries guide by webpack it keeps including those dependencies in my main build and I am out of ideas on what setting that this is caused by...

Build analysis (when bundling my app)

Here you can see the node_modules and wizer-components/node_modules. Including react-dom twice (and others)

enter image description here

Build analysis (of a component)

As you can see no node_modules are bundled here...

enter image description here

Setting files

Because I can't find where the issue lies I have created gists of my config files:

  • webpack.config.js (of component library)
  • webpack.config.production.js (of app)

Setup

Just as info, I'm using a monorepo setup with lerna to npm link the dependency of (wizer-components) without the need to push it to npm as a module. Could this be an issue in where webpack thinks that it needs to re-add the react (and others)?

NealVDV
  • 2,302
  • 3
  • 26
  • 51

1 Answers1

2

After a total of 4 days of trying to make this work (was doing this before I asked the question), I managed to solve it (FINALLY)!

The issue was with lerna / NPM link and dependency resolving, see handy links at the bottom of this answer.

I fixed it by doing the following steps:

  1. Moving the dependencies (react, react-dom) to peerDependencies in the wizer-components (my component library) package.json file
  2. Removing all my node_modules folders (app and component library)
  3. Running $ lerna bootstrap to re-download my node_modules
  4. Removing my build process of my component library (I build these when I build my app)
  5. Changing my webpack.config.production.js in these key areas

(did a picture because it wouldn't format it right on here -_-

enter image description here

Helpful links (also look at the comments):

NealVDV
  • 2,302
  • 3
  • 26
  • 51
  • Always remember that when webpack searches for js files to bundle, it searches *all* folders in your project by default unless you explicitly tell it to include or exclude certain paths. Feel free to mark this as solved. :) – MForMarlon Aug 28 '17 at 22:08
  • 1
    Man, you saved my life here. Your fix helped me solve a completely different problem (fixing a problem where babel wasn't transpiling prebuild dependencies) -- my fix was to remove the exclusion of node_modules from the babel rule (perhaps unrelated, though it sparked the idea). But what I really wanted to upvote you for was your honesty about spending 4 days to solve the problem. Well done. Most people would underestimate that by a lot I suspect. More might have just given up. – PaulG May 16 '21 at 22:22