Routes lazy loading support #1324

New Issue

fergalmoran · 2025-08-09T17:19:42Z

fergalmoran commented

2025-08-09 17:19:42 +00:00

Originally created by @m-ratnikov on 10/11/2016

Hello!
First of all I want to say thank you for the project. It's really great starting point for development and everything works fine in initial configuration.
But when I tried to implement routes lazy loading I realized that it doesn't work.
I made a few modifications to the initial project:
I've just added new module (CounterModule):

import { NgModule } from '@angular/core';
import { CounterComponent } from './counter.component'
@NgModule({
    declarations: [
        CounterComponent
    ]
})
export class CounterModule {
}

then rewrite appropriate route in the AppModule:
{ path: 'counter', loadChildren: './components/counter/counter.module#CounterModule' }

and changed one loader in the webpack.config:
{ test: /\.ts$/, include: /ClientApp/, loaders: [ 'ts', 'angular2-router-loader' ] },

To support routes lazy loading I've used angular2-router-loader.
But consequently when I click "Counter" link I just move to the home page. CounterComponent lazy loading doesn't occur. No errors in the console.
What can be the reason of the problem? Maybe I should use something instead "angular2-router-loader" or I just forgot something in configuration. Will greatly appreciate any help.
Here the link to my test project for issue reproducing.

Thanks in advance!

*Originally created by @m-ratnikov on 10/11/2016* Hello! First of all I want to say thank you for the project. It's really great starting point for development and everything works fine in initial configuration. But when I tried to implement routes lazy loading I realized that it doesn't work. I made a few modifications to the initial project: I've just added new module (CounterModule): ``` import { NgModule } from '@angular/core'; import { CounterComponent } from './counter.component' @NgModule({ declarations: [ CounterComponent ] }) export class CounterModule { } ``` then rewrite appropriate route in the AppModule: `{ path: 'counter', loadChildren: './components/counter/counter.module#CounterModule' }` and changed one loader in the webpack.config: `{ test: /\.ts$/, include: /ClientApp/, loaders: [ 'ts', 'angular2-router-loader' ] },` To support routes lazy loading I've used [angular2-router-loader](https://github.com/brandonroberts/angular2-router-loader). But consequently when I click "Counter" link I just move to the home page. CounterComponent lazy loading doesn't occur. No errors in the console. What can be the reason of the problem? Maybe I should use something instead "angular2-router-loader" or I just forgot something in configuration. Will greatly appreciate any help. Here the [link](https://yadi.sk/d/72noWLEcwcncj) to my test project for issue reproducing. Thanks in advance!

fergalmoran closed this issue

2025-08-09 17:19:42 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#1324