Using Angular 17.3.4, nx 18.2.4, and Module Federation.

From the Host’s home page I am able to navigate to RemoteA. From the home page I am also able to navigate to RemoteB. However, when I try to navigate from one remote to the other I get:

TypeError: Cannot read properties of undefined (reading 'call')

Followed by:

ReferenceError: Cannot access 'NcProgramEntryModule' before initialization

Host Setup

module-federation.manifest.json

{
    "RemoteA": {
        "url" : "http://localhost:16007",
        "api" : "nothing"
    },
    "RemoteB": {
        "url" : "http://localhost:16006",
        "api" : "nothing"
    }
}

Using withModuleFederation(config) – module-federation.config.ts

import { ModuleFederationConfig } from '@nx/webpack';

const config: ModuleFederationConfig = {
  name: 'dashboard',
  remotes: [],
  shared: packageName => {
    if (packageName.includes('@angular/')) return { singleton: true, requiredVersion: '~17.3.4' };
    if (packageName.includes('@ngx-translate/')) return { singleton: true, requiredVersion: false };

    return false; 
  }
};

export default config;

app-routing.module.ts

export const routes: Routes = [

  {
    path: '',
    component: LandingPageComponent,
    canActivate: [AppGuard]
  },

  {
    title: "RemoteA",
    path: 'RemoteA',
    loadChildren: () => loadRemoteModule('RemoteA', './Module').then((m) => m.RemoteAEntryModule)
  },

  {
    title: "RemoteB",
    path: 'RemoteB',
    loadChildren: () => loadRemoteModule('RemoteB', './Module').then((m) => m.RemoteBEntryModule)
  },
  
  { title: "", path: '**', redirectTo: '' }

];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Remote Setup

RemoteA.entry.module.ts

@NgModule({
  declarations: [
    RemoteAEntryComponent
  ],
  imports: [
    CommonModule,
    TranslateModule,
    FormsModule,
    RouterModule.forChild(routes)],
  providers: []
})
export class RemoteAEntryModule { }

RemoteA.entry.routes.ts

export const routes: Route[] = [
  {
    path: '', component: RemoteAEntryComponent,
    children: [
      {
        path: '', component: RemoteAOverviewComponent
      }
    ]
  }
];

module-federation.config.ts

import { ModuleFederationConfig } from '@nx/webpack';

const config: ModuleFederationConfig = {
  name: 'remote',
  exposes: {
    './Module': 'remote/src/app/remote-entry/RemoteA.entry.module.ts',
  },
};

export default config;

Please let me know if I am missing any relevant code snippets as well.