Trickkiste Angular #1 - Imports & Exports isolieren

Um zu verhindern, dass die app.module.ts Datei völlig überladen mit diversen Imports und Exports wird, packe ich diese gerne in separate Includer-Modules, deren einzige Aufgabe es ist, andere Modules bereitzustellen.

Beispiel für @angular-materials:

Neues Modul erstellen im Verzeichnis includers:

ng g m includers/material-includer

Im neuen Modul füge ich ein Array mit allen verwendeten Modules hinzu, welche im Zusammenhang mit dem @angular-material Package stehen. Anschließend das neue Array noch in die Imports und Exports Listen gepackt.

const components = [
  MatButtonModule,
  // weitere Mat*Module
];

@NgModule({
  imports: [components],
  exports: [components]
})
export class MaterialIncluderModule {
}

Zuletzt das neue Modul noch laden:

@NgModule({
  ...
  imports: [
    ...
    MaterialIncluderModule,
  ],
  ...
})
export class AppModule {
}