2016-12-13 2 views
0

Wenn ich eine Komponente - Komponente A - mit Importen wie:rxjs modulare Ein- und Bündelgröße (webpack2/angular2 cli)

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 

und ich habe eine weitere Komponente - Komponente B - mit duplizieren Importe:

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 

und ich bauen ein ng build --prod verwendet, wird die Einfuhr oder muss ich 2x Kopien jeder Import in meinem Bündel der CLI de-duplizieren? Darüber hinaus wird die --aot Option Auswirkungen haben? Wenn du es nicht weißt, hast du dann Vorschläge, wie ich das testen kann?

+1

ES6-Modulimporte werden von Entwurf nicht dupliziert. Es gibt ein Szenario, in dem verschiedene NPM-Pakete unterschiedliche Abhängigkeits-Versionsbeschränkungen oder versehentlich duplizierte Abhängigkeiten haben (können mit 'npm-Deduplizierung' behoben werden), dies kann dazu führen, dass mehrere Paketkopien pro Bündel vorliegen. Dies ist jedoch nicht der Fall, wenn die Komponenten A und B zum selben Paket gehören. In jedem Fall können Sie den Inhalt des Webpack-Pakets unter https://github.com/webpack/webpack/issues/690 erkunden – estus

Antwort

1

Absolut nicht. Die ng build --prod verwendet Webpack module bundling System im Hintergrund, um die Dateien zu bündeln. Webpack ist intelligent genug, um die Importe nicht zu duplizieren.

Die Verwendung der --aot Option ist großartig. Es verwendet Angular AOT Compilation, um die Dateien zu bündeln. d. h. Vor der Zeitkompilierung bedeutet dies einfach die Zusammenstellung der eckigen Dateien, bevor sie an den Client geliefert wird. Dies beseitigt die Kompilierungsphase, die lange Ladezeiten verursacht. Hier ist ein besserer zu erklärender Artikel Angular AOT