CODEWITHSUNDEEP
angularnrwl-nxwebpack-module-federationnrwlangular-module-federation
Mustafa Patharia
Mustafa Patharia

Reputation: 101

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 following error when trying to access routes on the remote app from host app:

ROR Error: Uncaught (in promise): Error: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`. Find more at https://angular.io/errors/NG0203 Error: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`. Find more at https://angular.io/errors/NG0203

I have confirmed that the remote app is correctly exposed and that the routes are accessible in the remote app and able to access remoteEntry.mjs on port where remote is serving.

Here is my configuration in mf.manifest.json (HOST):

{
    "remote-app": "http://localhost:4201"
}

And here is the code on host app.router.ts (HOST)

import { NxWelcomeComponent } from './nx-welcome.component';
import { Route } from '@angular/router';
import { loadRemoteModule } from '@nx/angular/mf';

export const appRoutes: Route[] = [
  {
    path: '',
    loadChildren: () =>
        loadRemoteModule('remote-app', './Module').then(
            (m) => m.RemoteEntryModule
         ),
  },
  {
    path: '',
    component: NxWelcomeComponent,
  },
];

here is the main.ts (HOST):

import { setRemoteDefinitions } from '@nx/angular/mf';

fetch('/assets/mf.manifest.json')
  .then((res) => res.json())
  .then((definitions) => setRemoteDefinitions(definitions))
  .then(() => import('./bootstrap').catch((err) => console.error(err)));

Upvotes: 5

Views: 1419

Answers (1)

menethil
menethil

Reputation: 63

still i could not realize the root cause of the issue but i ve managed to get it worked by installing the packages with yarn. i am guessing something was wrong with package-lock file and project graphs

Upvotes: 0

Related Questions