Al usar ganchos React useContext , actualmente requiere una importación desde un componente más arriba en el árbol para pasar el objeto Context . Di por ejemplo:

 // index.jsx export const MyContext = React.useContext('1') export function MyApp(props){ return ( <MyContext.Provider value='1'> <ChildComponent /> </MyContext.Provider> ) }

 // ChildComponent.jsx import {MyContext} from './index'; export function ChildComponent(props){ const context = useContext(MyContext); return (<p> {context} </p>) }

Pero si el componente secundario está federado, estará en un repositorio independiente y no podrá importarse desde './index' .

En el nivel de MyApp , puedo importar ChildComponent con:

const ChildComponent= React.lazy(() => import('federatedApp/ChildComponent'))

siempre que dentro de la configuración del paquete web, la aplicación federatedApp se nombre como remota y el documento HTML incluya el punto de entrada de los módulos remotos .js. Pero, ¿cómo podría darle MyContext a la aplicación federatedApp remota?

Adivina la respuesta : ¿Necesitaría separar los dos componentes en index.jsx en dos archivos y exponerlos por separado?