Para facilitar as coisas usaremos um template que já possui webpack configurado com Plugin de importação e exportação de arquivos chamado ModuleFederationPlugin

pnpx create-mf-app

Escolha o nome do seu app

Escolha o tipo do seu app (pode ser uma aplicação / API ou Biblioteca), nesse caso iremos com aplicação

Escolha a porta de saída do seu app

PS: Lembre-se de não usar a mesma ou uma porta já utilizada para evitar reconfigurar webpack e tudo mais

Escolha a tecnologia do seu app (usremos React, mas sinta-se a vontade para experimentar os outros)

Escolha a linguagem (usaremos JS por simplicidade, há forma de exportar as tipagens do Typescript, mas demanda um pouco mais do tempo do que a proposta da talk)

Escolha o modelo css (usaremos o default)

▶️ cd appname
▶️ npm install
▶️ npm start

ou

▶️ cd appname
▶️ yarn
▶️ yarn start

Crie seu componente React normalmente

No seu webpack.config.js na raíz do projeto, busque pelo objeto plugins e na prorpieade exposes. O exposes é o responsável por expor o nosso componente para fora da aplicação

Lembre-se

Primeiro parâmetro exportação Nomeada do componente Caminho absoluto dentro da aplicação (usando a extensão do arquivo)

exemplo:

"./MyComponent": "./src/MyComponent.jsx",

PS: atente-se ao nome dentro da propriedade name em ModuleFederationPlugin, pois usaremos posteriormente

Agora vamos importar o componente

primeiro padâmetro, busque no nome do remote, importe usando o padrão nome@url:PORT/fileNameExport.js

exemplo:

 remote:'remote@http://localhost:8082/remotesEntry.js'

Agora no projeto, busque pelo arquivo onde você deseja adicionar o MFE, e importe-o dessa forma:

import MeuComponent  from 'remote/MyComponent'

Você pode usar como um componente normal escrito em JSX, porém são boas práticas e prevenção de erros usar a importação de módulos asincronas do React, para ter tolerância a falhas é recomendado uma classe em React para tratar o erro

Em remote rode

yarn build

Agora você deve servir a pasta /dist

Recomendo o uso da ferramenta http-server para servir os estaticos localmente