Angular Lazy Loading multiple packages of same Module

I am in processing of converting an Angular application to lazy loading. There are multiple modules which are dependent on each other. I need to know that what are the best practices to deal with such situations? I am not using preload all modules strategy, still when I click on link directing to Candidate Module, it is loading two extra packages which I think are downloading because its of dependency on other modules. I need to how to handle such situation in which lazy loaded modules are dependent on other lazy loaded modules.

enter image description here

1 answer

  • answered 2019-11-08 16:01 Rajat Badjatya

    Declare those dependent components in the shared module.

    This is a common situation where you need some components in more than one module, So put all those common components, directives, pipes, services in the shared module, import this shared module into the feature module(lazy loaded module). This will reduce the overhead of loading the whole feature module while loading another feature module as Angular adds this shared module code into your feature module so at run time you will only fetch one package.

    Read what Angular says in his style guide about Shared Module.