vite icon indicating copy to clipboard operation
vite copied to clipboard

Micro frontend architecture using federated Remix apps

Open douglaszaltron opened this issue 1 year ago • 13 comments

With this, we have a better approach for structuring microfrontends with Remix. Have any studies been conducted on this? How can we improve the developer experience (DX) for integration with Remix to achieve a higher level of server-side rendering and routing?

https://github.com/remix-run/remix/discussions/1989 https://github.com/jrestall/remix-federation

douglaszaltron avatar Sep 30 '24 12:09 douglaszaltron

I'm not aware of any tests in this direction. Would you like to give it a try?

gioboa avatar Sep 30 '24 12:09 gioboa

I want to build Remix demo with @module-federation/vite. My repo, https://github.com/devmax214/remix-microfrontend-demo And it does not work with the remote component. https://github.com/devmax214/remix-microfrontend-demo/blob/master/host/app/routes/_index.tsx#L16, no response from here.

Please help me if anyone has a solution or how I can dubug deeper.

devmax214 avatar Nov 25 '24 20:11 devmax214

@zhangHongEn @gioboa @ScriptedAlchemy trying to pull some attention here. We tried a few things to make it work, but we were not sure what we were missing.

veeramarni avatar Nov 25 '24 22:11 veeramarni

I hope this can work 🙏 Waiting for the release version to integrate with the remix together! Especially the react-router v7. Thanks

harrytran998 avatar Nov 26 '24 00:11 harrytran998

Hello.

Im testing with 2 simple react router 7 framework apps, one of them exporting a simple component, and the other importing that remote component.

When i run the remote app it gives the following error:

image

The configuration is the following:

image

image

After i resolve this issue, i will try to import the federated component into the host app.

Can you help me?

Thanks.

RJesusTVD avatar Dec 03 '24 10:12 RJesusTVD

Can you help me?

I'll try to create a POC with Remix

gioboa avatar Dec 09 '24 16:12 gioboa

I did this example

It's not working yet because this import from the host is never resolved ( no errors ) 😮‍💨

const Remote = lazy(
  async () => import('remote/remote-app'),
);

Any help is more than welcome.

gioboa avatar Dec 18 '24 17:12 gioboa

Any news on react router v7 (framework apps)?

RJesusTVD avatar Jan 15 '25 09:01 RJesusTVD

I have a rsbuild plugin in the works. But have been on holiday. Will wrap it up this month.

ScriptedAlchemy avatar Jan 15 '25 11:01 ScriptedAlchemy

@ScriptedAlchemy any update?

veeramarni avatar Mar 05 '25 10:03 veeramarni

Just need to fix a few last issues with ssr support for federation. It's currently under the rspack-contrib repo if you wanna follow along.

ScriptedAlchemy avatar Mar 15 '25 09:03 ScriptedAlchemy

Thanks, i looked at https://github.com/web-infra-dev/rsbuild/commit/9b95f5937ead0006cd0638a46e588ad14015073e how this applies to vite plugin?

veeramarni avatar Mar 15 '25 18:03 veeramarni

Thanks, i looked at https://github.com/web-infra-dev/rsbuild/commit/9b95f5937ead0006cd0638a46e588ad14015073e how this applies to vite plugin?

It's moved to the rspack-contrib not the rsbuild repo directly.

It doesn't apply to vite but I'm pretty sure it's not possible to support ssr and federation with vite. So I'm providing you an option that's possible.

ScriptedAlchemy avatar Mar 15 '25 22:03 ScriptedAlchemy

As there's been no activity for 30 days, this issue has been flagged as stale. If you'd like it to remain open, please add a comment within the next 7 days. Thank you.

github-actions[bot] avatar Nov 09 '25 14:11 github-actions[bot]