Angular 2 - Module in ein eigenes Projekt verschieben

Ich versuche, eine portalähnliche Funktionalität mit Angle 2 zu erstellen, die Basisnavigation und globale Dienste wie die Authentifizierung bereitstellt, aber anderen Entwicklern die Erstellung eigener Module ermöglicht, die sich grundsätzlich in das Portal einbinden lassen.

Ich benutze Angular-CLI und habe einen schnellen Proof of Concept mit den Modulen erstellt, die im Projekt erstellt werden (siehe Baum unten) und die über den Router (mit loadChildren) in app.module geladen werden. Jedes untergeordnete Modul hat einen eigenen Router und ist grundsätzlich vom übergeordneten Portal (app.module) entkoppelt.

Ich möchte diese untergeordneten Module letztendlich in ihre eigenen Projekte verschieben, habe jedoch keine Ahnung, wo ich anfangen soll, und es scheint nur sehr wenige Informationen zu geben, die sich online auf diese Module beziehen. Wenn jemand ein Beispiel kennt oder demonstrieren kann, wie man das einrichtet, wäre ich sehr dankbar.

Bearbeiten: Ich möchte weiterhin die Angular-CLI-Funktionalität verwenden, um dies zu tun, wenn dies möglich ist.

Hier ist meine Verzeichnisstruktur. Die Module 1, 2 und 3 müssen in ihre eigenen Projekte einziehen.

+-- app
│   +-- app.component.css
│   +-- app.component.html
│   +-- app.component.spec.ts
│   +-- app.component.ts
│   +-- app.module.ts
│   +-- module1
│   │   +-- dataflows
│   │   │   +-- dataflows.component.css
│   │   │   +-- dataflows.component.html
│   │   │   \-- dataflows.component.ts
│   │   +-- module1.component.css
│   │   +-- module1.component.html
│   │   +-- module1.component.ts
│   │   +-- module1.module.ts
│   │   \-- other
│   │       +-- other.component.css
│   │       +-- other.component.html
│   │       \-- other.component.ts
│   +-- index.ts
│   +-- module2
│   │   +-- module2.component.css
│   │   +-- module2.component.html
│   │   +-- module2.component.ts
│   │   \-- module2.module.ts
│   \-- module3
│       +-- dummy1
│       │   +-- dummy1.component.css
│       │   +-- dummy1.component.html
│       │   \-- dummy1.component.ts
│       +-- module3.component.css
│       +-- module3.component.html
│       +-- module3.component.ts
│       +-- module3.module.ts
│       \-- dummy2
│           +-- dummy2.component.css
│           +-- dummy2.component.html
│           \-- dummy2.component.ts
+-- index.html

Antworten auf die Frage(4)

Ihre Antwort auf die Frage