Umgang mit mehreren Anwendungen mit angular cli

Question

Ich bin daran interessiert, mehrere Anwendungen mit dem eckigen cli Bootstrap.

Durch die Winkel-cli Wiki konnte ich ein Beispiel https://github.com/angular/angular-cli/wiki/stories-multiple-apps

Auch fand ich https://yakovfain.com/2017/04/06/angular-cli-multiple-apps-in-the-same-project/

ich durch die Winkel cli.json Datei ging finden und lief

"apps": [ 
    { 
     "name": "app1", 
     "root": "src", 
     "outDir": "dist", 
     "assets": [ 
     "assets", 
     "favicon.ico" 
     ], 
     "index": "index.html", 
     "main": "main.ts", 
     "polyfills": "polyfills.ts", 
     "test": "test.ts", 
     "tsconfig": "tsconfig.app.json", 
     "testTsconfig": "tsconfig.spec.json", 
     "prefix": "app", 
     "styles": [ 
     "styles.css" 
     ], 
     "scripts": [], 
     "environmentSource": "environments/environment.ts", 
     "environments": { 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    }, 
    { 
     "name": "app2", 
     "root": "src", 
     "outDir": "dist2", 
     "assets": [ 
     "assets", 
     "favicon.ico" 
     ], 
     "index": "index.html", 
     "main": "main2.ts", 
     "polyfills": "polyfills2.ts", 
     "test": "test2.ts", 
     "tsconfig": "tsconfig.app.json", 
     "testTsconfig": "tsconfig.spec.json", 
     "prefix": "app2", 
     "styles": [ 
     "styles.css" 
     ], 
     "scripts": [], 
     "environmentSource": "environments/environment.ts", 
     "environments": { 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    } 
    ], 

ich konnte dies mit den folgenden Befehle ausführen bekommen

ng serve --app 0 
ng serve --app 1 

Meine erste Frage bei diesem Ansatz ist, wie dies im Fall beibehalten werden würde, dass wir mehrere Anwendungen in den Winkel-cli Liste? Dies wird ein bisschen viel zu überwachen und zu verfolgen.

Auch mit diesem Ansatz wäre es besser booten Sie ein anderes Modul in jeder main.ts-Datei bootstrapping?

Die zweite Möglichkeit, die ich sah, war in einem Beispiel in den Kommentaren.
https://github.com/Farata/angular2typescript/blob/master/Angular4/router-samples/.angular-cli.json.

Das ist ideal, auch wenn ich nicht in der Lage bin zu replizieren und zu identifizieren, wie all diese Anwendungen neben Namen die gleichen dist Ordner und alles andere teilen.

Mit dem zweiten Ansatz, alles zu teilen frage ich mich, wie diese anders als eine große Anzahl von Modulen und faul zu schaffen Laden sie?

Ich weiß, diese Frage ist sehr Theorie basiert, sondern Ressourcen online sind sehr begrenzt und ich würde daran interessiert zu wissen, wie andere Entwickler dieses Problem anzugreifen.

Answer 1

Wenn ich in angular-cli mehrere Anwendungen hätte, würde ich nennen sie mag:

"apps": [ 
    { 
     "name": "app1", 
     "main": "main1.ts", 
     ... 
    }, 
    { 
     "name": "app2", 
     "main": "main2.ts" 
    } 
] 

Dann app1 beginnen wir entweder

ng serve --app 0 

oder

ng serve --app app1 

I zweiter laufen bevorzugen Ansatz, weil es einfacher zu verstehen ist, welche Anwendung ist Laufen.

Wie sie überwachen?

Sie müssen wissen, was Sie :)

Auch bei diesem Ansatz tun würden Sie besser dran bootstraping ein andere Modul in jedem main.ts-Datei?

Es hängt davon ab, was Ihre Anwendung tun wird. Ich bevorzuge verschiedene Bootstrap-Module, weil ich auf diese Weise überschüssiges Material aus einigen Anwendungen herausschneiden kann.

Zum Beispiel muss ich zwei Anwendung mit fast der gleichen Logik haben, aber die zweite App ist nur ein Teil der ersten mit seinen eigenen Funktionen.

So kann meine zweite Anwendung Bootstrap SecondModule, die einige gemeinsam genutzte Anwendungen Module und seine eigenen Feature-Module importieren.

@NgModule({ 
    import: [ 
    SharedModule, 
    SharedModule2, 
    SecondFeature1, 
    ... 
    ] 
}) 
export class SecondModule {} 

Darüber hinaus sind für solche Anwendungen i schaffen würde Typoskript configs entsprechenden ts-Compiler (und expecially ngc Compiler) zu tun, einige redundante Arbeit zu schützen:

tsconfig.app1.json

files: [ 
    "main1.ts", 
    "path to some lazy loaded module" 
] 

tsconfig.app2.json

files: [ 
    "main2.ts" 
] 

Das ist ideal, auch wenn ich nicht in der Lage bin zu replizieren und zu identifizieren, wie alle diese Anwendungen neben Namen sonst die gleichen dist Ordner und alles teilen.

Ich denke, es ist ein Fehler. Ich würde diese Anwendungen in verschiedenen Ordnern ausgeben.

Als Frage ist Theorie basiert, würde ich sagen, dass, wenn Sie ziemlich große Anwendung haben, Sie wahrscheinlich mit Leistungsaufbau gestoßen sind. Und viele Anwendungen in einer eckigen Anwendung zu haben, kann zum Albtraum werden. Es ist nur meine Meinung und Erfahrung auf diesem :)