9

Moja aplikacja zawiera komponenty korzystające z dużego zewnętrznego pakietu (ag-grid, około 1 MB), który jest dostarczany jako moduł kątowy2 (AgGridModule). Chciałbym załadować pakiet tylko wtedy, gdy wymagane są składniki, które go używają, więc mój ContentModule i wszystkie jego submoduły są leniwie ładowane. Cała konstrukcja wygląda następująco:Udostępnianie modułu zewnętrznego między leniwymi modułami ładowanymi w trybie kątowym2

enter image description here

Jednak, kiedy importować AgGridModule się zarówno Submodule1 i Submodule3, kończy się są zawarte w sporządzonej JS dwukrotnie, dzięki czemu zarówno 1.chunk.js i 3.chunk. js duże. Próbowałem zaimportować go do ContentModule, ale wtedy submoduły nie rozpoznają komponentów zawartych w AgGridModule, nawet jeśli wymienię je w właściwości exports z ContentModule.

@NgModule({ 
    imports: [ 
    ContentRoutingModule, 
    SomeOtherModule, 
    AgGridModule.withComponents([]) 
    ], 
    exports: [ 
    // this is the component from AgGridModule that I use 
    AgGridNg2 
    ] 
}) 
export class ContentModule { } 

Czy istnieje sposób, aby udostępnić moduł pomiędzy leniwych modułów załadowanych lub narazić niektóre elementy importowanego modułu do leniwych załadowane dzieci?

UPD: Tworzenie wspólny moduł i importowanie go do submodules nie pomaga, wciąż istnieją dwa kawałki z około 1MB każda: enter image description here

UPD2: I rozwiązać problem tymczasowo przez scalanie Submodule1 i Submodule3 w jeden moduł.

+0

Powinieneś dodać cały "AgGridModule" do tablicy eksportu. Możesz eksportować tylko deklaracje wewnątrz 'ContentModule' lub całych innych modułów – PierreDuc

+0

@PierreDuc no, eksportowanie całego' AgGridModule' nie rozwiązuje go, komponent wciąż nie jest rozpoznawany. –

+0

Jak obecnie generujesz swoją kompilację? kątowy-cli? – AngularChef

Odpowiedz

0

Można użyć numeru SharedModule, gdzie można import, a także export z AgGridModule. Musisz export kompletny moduł AgGridModule, a nie tylko elementy, których używasz.

Następnie można po prostu import z SharedModule w swoim Submodule1 i Submodule3.

+0

Niestety, prowadzi to do tego samego wyniku. Wszystkie moduły używające 'SharedModule' generują porcje obejmujące całą sieć ag-grid. –

+0

Oznacza to, że istnieją usługi wewnątrz 'AgGridModule' i muszą być dodane do AppModule. –

+0

Ale nie korzystam z żadnej z usług AgGridModule. Używam tylko jednego ze składników. –

4

Musisz utworzyć SharedAgGridModule:

@NgModule({ 
    imports: [ 
    AgGridModule.withComponents([]) 
    ], 
    exports: [ 
    ContentModule, 
    AgGridModule 
    ] 
}) 
export class SharedAgGridModule{} 

Następnie należy zaimportować ten moduł tylko dla submodułów który wykorzystuje AgGrid. Nie ma potrzeby również importowania ContentModule w tych submodułach, ponieważ jest eksportowany do tego modułu

+0

Tak samo jak z odpowiedzią Santanu, niestety :(I tak nie importuję ContentModule do submodułów. –

0

Stoimy w obliczu tego samego problemu.

2 Solutions

  1. Wstawić do importu i eksportu nim ShareModule. Moduł dodatkowy zaimportuje moduł ShareModule . Zasadniczo ShareModule nie ma leniwego obciążenia.
  2. Scal do tej samej ścieżki/modułu leniwego obciążenia razem.