Module Federation example using Webpack and Re.Pack for React Native

Installation

yarn --cwd MicroAppOne && yarn --cwd MicroAppTwo && yarn --cwd Host

Usage

Running app 1 container

App can be run as a standalone application using:

  1. STANDALONE=1 yarn --cwd MicroAppOne start (notice the dev server is running on port 9000)
  2. yarn --cwd MicroAppOne ios/yarn --cwd MicroAppOne android

Or as part of a Host application.

Running app 2 container

App can be run as a standalone application using:

  1. STANDALONE=1 yarn --cwd MicroAppTwo start (notice the dev server is running on port 9001)
  2. yarn --cwd MicroAppTwo ios/yarn --cwd MicroAppTwo android

Or as part of a Host application.

Running Host application with app containers

  1. Run dev server for app 1 container: yarn --cwd MicroAppOne start
  2. Run dev server for app 2 container: yarn --cwd MicroAppTwo start
  3. Run dev server for Host application: yarn --cwd Host start
  4. Build Host application: yarn --cwd Host ios/yarn --cwd Host android

Running Web Host application with app containers

  1. Run dev server for app 1 container: yarn --cwd MicroAppOne start
  2. Run dev server for app 2 container: yarn --cwd MicroAppTwo start
  3. Run dev server for Host application: yarn --cwd WebHost start

Notes

It might be helpful to open Re.Pack's web dashboard to analyse artifacts:

NOTE:

For Android, you should to change localhost to 10.0.2.2

msvargas#2

React Native Web Support

https://stackblitz.com/edit/github-l3cwda-lqkjpy?file=app1%2Fsrc%2FApp.js necolas/react-native-web#2273