Meine App enthält Komponenten, die ein schwergewichtiges externes Paket (ag-grid, etwa 1 MB) verwenden, das als angular2-Modul bereitgestellt wird ( AgGridModule
). Ich möchte das Paket nur laden, wenn die Komponenten, die es verwenden, erforderlich sind, also mein ContentModule
und alle seine Untermodule sind faul geladen. Die ganze Struktur sieht so aus:
Wenn ich jedoch AgGridModule
sowohl in Submodule1
als auch in Submodule3
importiere, wird es zweimal in kompiliertes JS aufgenommen, wodurch sowohl 1.chunk.js als auch 3.chunk.js groß werden. Ich habe versucht, es in ContentModule
zu importieren, aber dann erkennen die Submodule die Komponenten nicht, die in AgGridModule
enthalten sind, auch wenn ich sie in der Eigenschaft exports
von ContentModule
auflisten.
Gibt es eine Möglichkeit, ein Modul zwischen Lazy Loaded-Modulen zu teilen oder einige Komponenten eines importierten Moduls für Lazy Loaded Childs verfügbar zu machen?
UPD: Das Erstellen eines geteilten Moduls und das Importieren in Submodule hilft nicht, es gibt immer noch zwei Chunks mit je ca. 1MB:
UPD2: Ich habe das Problem vorübergehend gelöst, indem ich Submodul1 und Submodul3 zu einem einzigen Modul zusammengeführt habe.
Sie können eine SharedModule
verwenden, wobei Sie import
sowie export
die AgGridModule
verwenden. Sie müssen export
das komplette Modul AgGridModule
und nicht nur die Komponenten, die Sie verwenden.
Dann kannst du einfach import
the SharedModule
in deinem Submodule1
und Submodule3
.
Wir stehen vor demselben Problem.
2 Lösungen
Tags und Links angular typescript lazy-loading angular2-modules ng-modules