Micro Frontends - Vite, RSBuild and Module Federation V2

[@rustcohle928]

Thx for your video, you don't know when they will add support for HMR in conjunction with host-app?

Thx for your video, could you add nested react router dom to your example?

[@ozzolim]

Hi Russel!!, what happen if i don't want to work inside a mono repo?

[@russellcanfield]

@@ozzolim you don’t have to, the federation plug-in takes a url in the config or you can load remotes dynamically

[@egorshumanskii8026]

Sadly, it doesn't work out. Just a blank page when I've integrated host and vite-remote. 😪 No errors in the console and the Network tab shows a bunch of files are loaded as well as remoteEntry.js are accessible directly in the browser.

[@baoien5520]

Can you sharing a video talk about deployment mfe on PROD env? Thanks

[@russellcanfield]

I briefly touch on the topic in this video, but I do have a follow up one coming about Zephyr Cloud kzbin.info/aero/PLemTpfu9eAGERzgHBYU_ibWJ_clKpTWfI&si=GHEm_YCW9zeWMGXn

[@RyanGarant-l5z]

Is there a reason to manually target Chrome89 instead of leaving that blank?

[@russellcanfield]

@@RyanGarant-l5z yes you need it to support top level await

[@SymyonYY]

Thank you for the video, I think the only one or one of the few that show the use of the new plugin. Running it locally work perfectly fine, but when deployed it doesn't. I tried also to just build it and serve it from the dist folder and same thing. Are there any special steps to prepare MFE architecture for deployment or to run in prod?

[@russellcanfield]

You may need to set the public path to auto for remotes and “/“ for the host. What errors are you seeing?

[@SymyonYY]

@@russellcanfield Tahnk you for your reply. Right now from the example in the video I have: virtual:mf-REMOTE_ENTRY_ID:28 Uncaught Error: Module ./modulepreload-polyfill does not exist in container. at Module.getExposes (virtual:mf-REMOTE_ENTRY_ID:28:44

[@SymyonYY]

And by public path I assume you mean base? not working sadly

[@russellcanfield]

@@SymyonYY Are you using module preloads? If you are, try to limit them just to the libraries you are sharing such as react for example. You need the function implementation of module preload

[@SymyonYY]

@@russellcanfield THe index.html in the dist folder does preload modules, particullarily for the runtimeInit artifact. But how do you limit what it gets in there? By the way code is 1 to 1 from the video, I don't do anything else, I am tryin gto have a 100% working example so I can work on my project afterwards.

[@christmas7056]

Hi Russell, I want to understand more on micro frontend and how things are working here. Like I just discovered this. Could you help me with some resource or you could make some videos for your audience. I can see you are the few initial ones who is creating content on this.

[@russellcanfield]

@@christmas7056 hey! Sure I have several videos under this playlist that should help

[@christmas7056]

@@russellcanfield Found it, Thank you very much