0

Given 2 lazy loaded modules tableau-de-bord and import. These 2 modules are both importing a common shared-module which is actually shared between all the modules of the app.

My problem is, when I run ng serve or ng build, I should have let's say 2 chunks for the two modules. Instead, I have 3 (src-app-modules-import-import-module.js, src-app-modules-tableau-de-bord-tableau-de-bord-module.js and default~src-app-modules-import-import-module~src-app-modules-tableau-de-bord-tableau-de-bord-module.js).

When I first created the import module and ran ng serve, that default~src thing was not there. Some times later, it appeared.

Of course if I delete that file, one of the two modules will fail to load.

It is really annoying because when I load one of import or tableau-de-bord, that file is downloaded too and it also increases the final size of the app.

So why is creating this file and can I get rid of it? If yes, how?

Note that i have other modules that have the same issue. The app is holding 8 modules but this doesn't happen on all of them.

Edit: Turns out it is because the two modules linked are importing one same module. For instance, import-module and tableau-de-bord-module are both importing FontAwesomeModule (I only need it in these two). I've removed the import on import-module and the default~src was gone.

Then I tryed to put FonAwesomeModule inside shared-module hoping it will be available on the modules where I need it without creating another linked chunk but nope. The chunk got created every time I use font-awesome in both modules.

So there come the question. How can I share a module between modules without having that default~src stuff created?

Is it even a normal behaviour?

4

0 回答 0