Stack Overflow
Stack Overflow

Questions tagged [angular-module-federation]

106 questions
6
votes
0 answers

Sharing AuthService data between shell & micro front end using module federation plugin - remote library

I have separate repositories for my shell & my microfrontends & I would like to share the auth service data between shell & microfrontends. I have used below article "Step 5: Share a Library of Your Monorepo" to create the AuthService shared…
VR1256
  • 1,266
  • 4
  • 28
  • 56
5
votes
1 answer

Angular federated module can not be loaded when route would be activated

I am trying to achieve a very simple module federation with shell (host) and travel (remote). Whenever I try do dynamically load the AbcModule from travel I get the following error in the shell: ERROR Error: Uncaught (in promise): TypeError: Cannot…
Stefan
  • 1,122
  • 3
  • 14
  • 38
4
votes
0 answers

How do I access a shared asset via Angular mdule federation?

I'm using Angular 14 and module federation. In my remote app, I have this file structure - package.json - webpack.config.js + src - settings.json + app + services - app.service.ts In my app.service.ts file, I access a…
Dave
  • 15,639
  • 133
  • 442
  • 830
3
votes
2 answers

Using Webpack module federation to load remote React app gives TypeError: fn is not a function

I am developing microfrontend using Webpack 5 Module Federation. My host app is an Angular project. My remote app is an React. Both are using Typescript. My setup is like following: The React (remote) project In React project (which is the remote…
user842225
  • 5,445
  • 15
  • 69
  • 119
3
votes
0 answers

Unsatisfied version 0 from shell of shared singleton module firebase/messaging (required ^9.17.1) at getStrictSingletonVersion

Basically i want to add Firebase on my Angular app. I am using NX Module Federation and after i do npm i firebase i get the error above. I have one package.json for all microservices and shell together so there can't be version mismatch, i…
bmitar
  • 56
  • 4
3
votes
0 answers

TypeError: container.get is not a function

I'm implementing module federation in my Angular project, below is my Microfrontend's webpack.config.js const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin"); const mf =…
VIK6Galado
  • 650
  • 14
  • 32
3
votes
1 answer

Module federation in angular ready for production?

I'm still learning about module federation angular in my office work. Is module federation in angular ready for production level?
Afif Alfiano
  • 301
  • 2
  • 8
3
votes
0 answers

ChunkLoad Error with Angular and module Federation

I'm trying to create an angular micro-frontends using module federation. Following this tutorial (the angular CLI part), I've created 3 projects in an angular workspace: shell, admin and dashboard. I'm trying to create a simple example of…
Aw3same
  • 930
  • 4
  • 13
  • 38
3
votes
1 answer

How to use Angular Module Federation to import an entire app

I'm fairly new to Ng Module Federation, but I think I have the gist of it. My issue is that most of the references I've seen either import a single component, or a module that is lazy-loaded in the router. I would like to include an entire mini-app…
Wayne F. Kaskie
  • 3,257
  • 5
  • 33
  • 43
2
votes
1 answer

Shell tries to load remote module from wrong port ("cannot match any routes")

I have the following issue, briefly described in the below image: The shell appolication has 2 mfe's as follows (module-federation.config.js): const ModuleFederationPlugin = require('webpack/lib/container/ModuleFederationPlugin'); …
noamyg
  • 2,747
  • 1
  • 23
  • 44
2
votes
0 answers

Error NG0203 when trying to access routes on remote app in Module Federation with Nrwl

I am trying to use Module Federation with Nrwl in an Angular application. I followed the documentation for Dynamic Module Federation with Angular (https://nx.dev/recipes/module-federation/dynamic-module-federation-with-angular) but I'm getting the…
Mustafa Patharia
  • 61
  • 3
2
votes
2 answers

How to add custom http header to angular module federation remoteEntry.js load call?

I have a host app and few micro front end apps all are angular 15. I've used "@angular-architects/module-federation": "^15.0.3". Everything works fine, except I could not intercept the http call which loads the remoteEntry.js files of the mfe…
Alphonse
  • 37
  • 8
2
votes
1 answer

In Angular 14 and module federation, what is the correct way to use import.meta.resolve?

I'm using Angular 14 and module federation. I want to use import.meta within my remote application to get the absolute path (e.g. starting with "http://") of a resource. In my remote application, I have webpack.config.js configured like…
Dave
  • 15,639
  • 133
  • 442
  • 830
2
votes
0 answers

Export global styles and assets using angular module federation

I implemented Webpack 5 module federation in my angular app and was able to import it into another app by exporting the remote module webpack.config.ts However, I'd also like to export the global style sheet so the host app gets all the global CSS.…
Zeev Britz
  • 23
  • 5
2
votes
0 answers

How to address hashed remoteEntry.xxxxxx.js in routing using loadRemoteModule in module federation

I want to use hashed remoteEntry in order to overcome cached remoteEntry.js issue in micro front ends apps. currentry I have used filename: 'remoteEntry.[hash:16].js', in my mfe webpack.config.js but dont know how to address it in my main app…
Elham Sedighi
  • 21
  • 2
1
2 3 4 5 6 7 8