nrwl / react-module-federation

Example showing how to use Nx's new module federation support to speed up the builds of React apps
https://nx.dev/module-federation/faster-builds
85 stars 20 forks source link

Apps are not working independently #9

Open simeon-raykov opened 1 year ago

simeon-raykov commented 1 year ago

Hi there,

My team is developing a React SSR app using NX, and we have observed that the individual apps are not able to function independently. For example, if we have one remote and one host app, when we shut down the remote app, the JavaScript in the host app also stops working. Is this the intended behaviour? I could reproduce this with your example: https://github.com/nrwl/react-module-federation

Click here for more details https://github.com/nrwl/nx/issues/15559

CWSites commented 1 year ago

My understanding is that you can't serve the host without the remote app because it is a dependency.

Semantically, the host and the remotes comprise one application, so you cannot build the host without the remotes.

There are more details here: https://nx.dev/recipes/module-federation/faster-builds

I'm only beginning to learn about module federation though so I could be wrong here... Perhaps wrap your remote app with a conditional render which only loads it if the remote app is available?

simeon-raykov commented 1 year ago

My understanding is that you can't serve the host without the remote app because it is a dependency.

Semantically, the host and the remotes comprise one application, so you cannot build the host without the remotes.

There are more details here: https://nx.dev/recipes/module-federation/faster-builds

I'm only beginning to learn about module federation though so I could be wrong here... Perhaps wrap your remote app with a conditional render which only loads it if the remote app is available?

We have attempted various approaches, such as conditional rendering, but it has not been successful. In my opinion, the host app should operate autonomously from the remote app. Consider this scenario: a single app shell containing three remote apps - shop, cart, and about. If the about app malfunctions, it should not disrupt the entire application's functioning.

CWSites commented 1 year ago

I don't disagree with you, one component failing to load shouldn't break the entire app.

Keep in mind that module federation is not an NRWL thing, but a Webpack thing. While the NRWL examples have modules within the same repo, bundled tightly together, that doesn't mean it's the only way to do it.

I am using a dynamic module loader and it works just fine if a module fails to load. https://dev.to/omher/lets-dynamic-remote-modules-with-webpack-module-federation-2b9m