The Angular CLI is a command line interface tool that can create a project, add files, and perform a variety of ongoing development tasks such as t...
For further actions, you may consider blocking this person and/or reporting abuse
You can also specify what 'kind' of lazy load you want. The default is true lazy loading where the module isn't loaded until the user visits that module. Another is called
prefetchwhere it's lazy loaded so it doesn't affect initial load of the app, but the lazy module is then loaded while the user is going through the app but not necessarily the lazy loaded module quick may provide a smoother transition between eager and lazy loaded modules.Here's how to do it:
Don't forget importing the dependency. You can specify per module by making your own version of this, there's an article on that out there. But as of right now, all or none is what comes out if the box from angular.
I wish Angular had component-based lazy loading...
Correct me if iam wrong, we do have a way for it through template binding
inside the code we can read this variable through viewchild,
then through viewcontainer ref we can creatembeddedview(of respective component)
It will sit inside this template.
That's dynamically creating component instances, not component lazy loading.
What I mean is loading the code of a component only when said component is needed.
Hi,
I using Angular 7, and when attempting ng build --prod I get this error for all my components: Cannot determine the module for class *Component.
Any ideas ? You do not need to import all your lazy loading modules in your app.module ?
Hello Sai
Thanks for this tutorial. I have a question for a line in above snippet. What does the below line do?
loadChildren: "../app/posts/posts.module#PostsModule"
We are referring to the posts.module.ts file just check out line 11 on posts.module.ts
A new addition in Angular6, we will be referring directly to the module like
loadChildren:() => PostsModule();
You won't getting lazy loading if you do it this way (as you will be adding the reference).
You can do this way. Just remove pair of braces.
loadChildren:() => PostsModule
core.js:1992 ERROR Error: Uncaught (in promise): Error: No NgModule metadata found for 'SalesOrderModule'.
Error: No NgModule metadata found for 'Module'.
getting error in lazyloading please shortout
Show man! Thanks!