Duplicate dependencies loaded despite shared configuration (testing enhanced federation)

[foxylion]

Hi everyone,

I'm running into an issue with the dependency sharing feature in enhanced module federation, and I could use some guidance.

I'm working with the module-federation-enhanced example from the Rsbuild examples repo. I've set up both the provider and consumer, and I can successfully access the consumer at http://localhost:2000/.

With Chrome developer tools open, I monitored the network traffic while loading the consumer and noticed something odd:

According to the configuration, both the provider and consumer are supposed to share react and react-dom, and they're using the same version. However, despite this setup, /lib-react.js (which I believe is react-dom) seems to be loaded twice.

But the network traffic shows that lib-react (this is react-dom as far as I can see) is loaded twice.

I tried modifying the sharing configuration as follows, based on recommendations I found suggesting react should always be shared as a singleton:

shared: {
  react: { singleton: true },
  "react-dom": { singleton: true },
}

Unfortunately, this change didn't resolve the issue. I'm clearly missing something, but I'm not sure what. 🤔

If anyone has tips or could point me to relevant documentation that might help shed some light on this, I'd really appreciate it!

Thanks in advance for your help!

Best,
Jakob

[foxylion]

If @ScriptedAlchemy or somebody else could respond this would be awesome! :-)

[ScriptedAlchemy]

Look at federation examples. On the React plugin for rsbuild it has a option for splitting router and React. Set them to false so chunk split doesn't interfere.

[foxylion]

Thanks, that did the trick.

It might be helpful to include correctly configured examples directly in the repo to prevent similar confusion in the future. I’ve made a suggestion here: rspack-contrib/rspack-examples#156.

Alternatively, another option could be to remove the shared configuration if it's not applied due to the defaults set by the React plugin.

[ScriptedAlchemy]

Perfect! Yes agree we should not split these when mf is in use