module-federation
Migration offramp examples for nextjs
Clear and concise description of the problem
With the change of next-mf status to maintenance, we noticed that it might be necessary to create examples for teams already considering migrating to other frameworks. I imagine that teams will make this transition gradually, so it would be helpful to consider a way for Next.js to interoperate with other frameworks, facilitating this change.
The examples could be organized by some recommended frameworks. Here are a few ideas:
- Next.js (host) with Rsbuild/Rspack (remote)
- Next.js (host) with ModernJS (remote)
- Next.js (host) with Remix (remote) ... Feel free to add more recommendations.
I believe these examples will be very helpful for those already thinking about migrating and will be of great value to the community.
Suggested solution
- Build a few of examples with different frameworks mentioned above that interop with Nextjs and post on MF Examples repo
- Build a section with migration guide on Docs.
Alternative
No response
Additional context
No response
Validations
- [X] Read the Contributing Guidelines.
- [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
I think we will have to reverse the strategy.
Next.js (remote) with Rsbuild/Rspack (host) Next.js (remote) with ModernJS (host) Next.js (remote) with Remix (host)
Youd take your current host, make it a remote, and use a new host who actually works well to pull the legacy next app back into it.
Next hosts are almost impossible to accept non next remotes.
We would have to create share replacements/shims for link,router, etc - nextjs is a locked system and will only work with its own stuff.
Any shim we create to try and reverse the order, Vercel will most likely try and break. We would need to disable Vercels ability to use make changes in effort to eat up our bandwidth with games of cat and mouse, the best way to lock them out of manipulating next.js deliberately to break federation offramps is to remove them as host and put a non-adversarial host in place.
Next.js is largely weaponized against federation, we have to assume its owner is hostile and act accordingly.
I agree, this approach makes a lot of sense! Reversing the role of Next.js to act as a remote while using a host with better federation compatibility is a smart strategy, especially given the constraints of the Next ecosystem.
There are also some Tanstack examples in the works, with Tanstack Start coming along its a very interesting alternative as well.
@zackarychapple do they work with SSR yet? I know vite base does not currently support ssr AFIK, are they rspack / webpack based?
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
Is it possible today to have a Next.js producer using next-mf be loaded into a non-next.js consumer that's using the rsbuild MF plugin or federation runtime if the Next.js remote module is not importing anything from next/*?
Curious if this use case is supported and how to do it.
@ScriptedAlchemy
RE: Tanstack Start
They are vite+vinxi+nitro-based. SSR is working. Does that mean it will work out-of-the-box or actualy not even close?
RE: Tanstack Start
They are vite+vinxi+nitro-based. SSR is working. Does that mean it will work out-of-the-box or actualy not even close?
Jumping in here to chime in. I'm not sure if anyone has explicitly tried using Tanstack Start with Rolldown yet. Maybe @tannerlinsley or @yyx990803 will know, but with Vite + Rolldown you have built in module federation support that is native to the bundler and not via a community plugin. This "should", emphasis on the word should, work out of the box. @underfin shared an example here. If you do adapt it to work with tanstack start please let us know and open a PR to examples so we can add it.