How to loadChildren async with angular-router-loader

Question

I have folder structure like:

 - app
   -core
   -vacancy

in core folder I have app.routing.ts where I would like to async add route to vacancy.

I did it like:

export const routing = RouterModule.forRoot([
        {
            path: '',
            component: HomeComponent,
            canActivate: [AuthGuard]
        },
        {
            path: 'vacancy',
            loadChildren: '../vacancy#VacancyModule'
        },
        {
            path: '**',
            component: NotFoundComponent
        }
    ], {useHash: true}
);

i get an error:

Can't resolve '..\vacancy'

dispite the fact there is folder vacancy in folder app and inside of vacancy there is a file vacancy.module.ts which ` looks like:

// some imports here
@NgModule({
    declarations: [
        VacancyBaseComponent
    ],
    imports: [
        CommonModule,
        FormsModule,
        RouterModule.forChild(routes),
    ],
})

export class VacancyModule {
    public static routes = routes;
}

Any ideas what I'm doing wrong?

AArias · Accepted Answer · 2017-08-17 21:59:52Z

1

Bit late. In case you haven't figured it out, try this:

loadChildren: 'app/vacancy/vacancy.module#VacancyModule'

edited Aug 17, 2017 at 21:59

AArias

2,5783 gold badges30 silver badges39 bronze badges

answered Aug 17, 2017 at 20:27

Gaurab Sarkar

261 bronze badge

Sign up to request clarification or add additional context in comments.

Comments

Sergey Barabanov · Accepted Answer · 2022-12-26 11:56:33Z

0

UPD: actual time 2022-12-26

In Angular version 8, the string syntax for the loadChildren route specification was deprecated in favor of the import() syntax. You can opt into using string-based lazy loading (loadChildren: './path/to/module#Module') by including the lazy-loaded routes in your tsconfig file, which includes the lazy-loaded files in the compilation.

By default the Angular CLI generates projects with stricter file inclusions intended to be used with the import() syntax.

https://angular.io/guide/lazy-loading-ngmodules#create-a-feature-module-with-routing

answered Dec 26, 2022 at 11:56

Sergey Barabanov

863 bronze badges

Collectives™ on Stack Overflow

How to loadChildren async with angular-router-loader

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related