SSR support with Module Federation (Different instances of vendor module)

[botoxparty]

Hi.

I currently am working on an application that uses the following setup:

• React DOM Server with renderToPipeableStream for streaming SSR
• Module federation to load modules at runtime

The issue i've run into is that the remote modules that use styled-jsx do not detect the provided StyleRegistry because the vendor code is bundled into the remote. Module Federation supports sharing dependencies however this does not seem to be working at all with styled-jsx.

I have tested this and can confirm that the vendor code for "styled-jsx" is never shared amongst packages.

Is there any way to make styled-jsx play nicely with module federation's dependency sharing?

I'm not sure how things work under the hood and how webpack bundles the transpiled code from styled-jsx but somehow I need all my remotes to use the same StyleRegistryContext so that I can render the style tags on the server side.

Any ideas?

Best,
Adam

[huozhi]

Hi, do you have a code sample that built up with styled-jsx and module fedoration that we could play and investigate with? Thanks