Loading React.js Modules in a React Native Host Using Re.Pack Module Federation

[kevin2huang]

Hello,

I am currently working on a React Native project with a micro frontend architecture using module federation and Re.Pack. The host application is built in React Native, and I have a remote module implemented purely in React.js, without any React Native-specific code.

Is it possible for the React Native host to directly load and use this React.js module using Re.Pack? If so, could you please provide some guidance or examples on how to achieve this?

[jbroma]

Hi @kevin2huang,

If the remote module is not rendering anything using DOM elements and is made purely out of stuff like hooks etc. then it should work out of the box. If there are DOM elements being rendered in that module then I'm afraid it's not possible to use a remote module like that - RN renderer won't know how to render that stuff.

[kevin2huang]

Thanks for confirming. Let's say if I still wanted use React js modules that contains DOM elements in this module federation/Re.Pack setup, the only options I'm aware of are:

1. use a WebView inside a RN component to load the Reactjs module
2. split the code into platform-specific files and use the React js remote module only for the .web.js files.

Is this correct? Or are there any other options you would recommend?