Description

Demo shop for the article You Might Not Need Module Federation: Orchestrate your Microfrontends at Runtime with Import Maps.

Prerequisites

Node 18.12.0.

Project structure

The project is using NPM workspaces and Nx.

t-shop
├─ mfs ⬅ microfrontends
│  ├─ product-buy-box
│  ├─ product-teaser
│  ├─ product-tile
│  ├─ shop-footer
│  └─ shop-header
├─ publisher ⬅ handles submission of assets
├─ resolver ⬅ stores and updates import map
└─ shell ⬅ host app

Installation

npm install

Running the app

1. Run Import Map Resolver in terminal 1

npm run start

2. Build and publish microfrontends in terminal 2

npm run build

3. Open http://localhost:4173

Import map server

You can inspect current import map by calling: http://localhost:3000/api/