Obtuve este problema al intentar ejecutar pruebas en mi microfrontend Angular para usar dentro de Module Federation. Angular 12, paquete web 5.
Uncaught Error: Shared module is not available for eager consumption: 5487
¿Cómo configurar el consumo ansioso para estos módulos?
Cree un webpack.conf separado para probar
Puede establecer todos los módulos compartidos en eager: true en su webpack.config.js principal, pero eso lo obligaría a usar un tamaño de paquete más grande, una de las cosas que la federación de módulos pretende evitar.
Una mejor opción podría ser configurar un webpack.test.config.js, que solo se usará para ejecutar pruebas, y en ese archivo configure sus módulos como eager: true :
webpack.test.config.js
shared: share({ "@angular/core": { eager: true, singleton: true, strictVersion: true, requiredVersion: 'auto' }, "@angular/common": { eager: true, singleton: true, strictVersion: true, requiredVersion: 'auto' }, "@angular/common/http": { eager: true, singleton: true, strictVersion: true, requiredVersion: 'auto' } })En la mayoría de los casos, resuelva este problema configurando el eager: true en sus módulos Angular comunes compartidos:
shared: share({ "@angular/core": { singleton: true, strictVersion: true, requiredVersion: 'auto', eager: true }, "@angular/common": { singleton: true, strictVersion: true, requiredVersion: 'auto', eager: true }, "@angular/common/http": { singleton: true, strictVersion: true, requiredVersion: 'auto', eager: true }, "@angular/router": { singleton: true, strictVersion: true, requiredVersion: 'auto', eager: true },