CODEWITHSUNDEEP
javascriptangularlazy-loading
George George
George George

Reputation: 601

Angular2 Lazy Loading syntax

I am implementing lazy loading technique in an Angular6 project, but I am confused as for the syntax to fetch the "lazy" module.

Inside the app.module (main module), when declaring the Routes, I would like to ask if the following:

{ path: 'lazy', loadChildren: './lazy/lazy.module#LazyModule' }

is equivalent to the following:

import { LazyModule } from './lazy/lazy.module';

{ path: 'lazy', loadChildren: () => LazyModule }

Through my eyes, the second approach actually makes useless the lazy loading since the LazyModule has to already been imported in order to call it. In the first approach, I successfully call the LazyModule without having to import it.

Any help is welcome.

Upvotes: 2

Views: 106

Answers (1)

Guerric P
Guerric P

Reputation: 31805

You're right, the second solution is actually not lazy loading. As you stated, the purpose of lazy loading is not to import the module (like on your first example), otherwise it is included in the initial chunk, thus eagerly loaded.

So the answer to your question is: no, the two syntaxes are not equivalent.

Upvotes: 3

Related Questions