Lazy Load Modules which are not part of routes

0
votes

How can I load modules/components with lazy load those are being used in another component/module?

Let's say there are below 3 modules, where login and home are being loaded with lazy load.

  • AppModule (main)
  • LoginModule
  • HomeModule

Now, I've created another module lib module which contains few custom components like grid, buttons etc.. these components will be consumed by components of a home or other modules and will never going to be used directly from any routes.

Here, if lib module is imported into a home and other modules it's being duplicated in each chunk file.

Is there any way to lazy load lib module along with routes without duplicating code?

I also tried to import lib into app module but it's not working with a lazy load of the home module and gives an error that If 'grid' is an Angular component, then verify that it is part of this module.

2
angularlazy-loadingangular5
implemented same as given in this comment, but want to avoid duplication in each chunk file stackoverflow.com/a/46073868/6171030 – Vijay Chauhan

2 Answers

2
votes

Since this module is not part of any routing , ti seems to me kind of shared module . And your shared module should be imported only once in the whole application.

You should import the core module into main module with decorator as @optional and @SkiptoSelf which will ensure to load the module only once in the whole application.