Dynamically loading micro frontends
Let’s prepare our main application gym diary to consume the micro frontend that we prepared previously. To do this, let’s start by creating a new module in the application. On the command line, we will use the following Angular CLI commands:
ng g m exercise --routing ng g c exercise/exercise
With the preceding commands, we create the module with the generated route file and a component that will be responsible for loading mfe
.
Let’s adjust the exercise-routing.module.ts
file to target the component:
import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { ExerciseComponent } from './exercise/exercise.component'; const routes: Routes = [ Â Â { Â Â Â Â path: '', Â Â Â Â component: ExerciseComponent, Â Â Â Â title: 'Exercise Registry', Â Â }, ]; @NgModule(...