generator-angular2-typescript icon indicating copy to clipboard operation
generator-angular2-typescript copied to clipboard

How to handle lazy loaded modules with SystemJS Builder?

Open smartm0use opened this issue 9 years ago • 0 comments

In your Gulp file i see you use buildStatic to generate the production build, but you do not use lazy loading modules, provided by Angular2.

I'm developing an app based on your project and i added some modules in my application. I created the following router configuration since i use lazy loading modules:

const appRoutes: Routes = [
	{ path: '', component: MainComponent,
	    canActivate: [AuthGuard],
	    children: [
	        { path: 'dashboard', component: DashboardComponent },
	        { path: 'first-section', loadChildren: 'app/modules/FIRST-SECTION/first-section.module' },
	        { path: 'second-section', loadChildren: 'app/modules/SECOND-SECTION/second-section.module' },
	        { path: 'documents', component: DocumentsComponent },
	        { path: 'users', component: UsersComponent },
	        { path: '', redirectTo: 'dashboard', pathMatch: 'full' }
	    ]
	}
];

Here is my Gulp task (similar to yours):

gulp.task('app-bundle', function() {
    var builder = new Builder('src', 'src/systemjs.config.js');

    return builder.buildStatic('app/main.js', 'build/scripts/app.min.js', { minify: true });
});

But... if i try to run a server on the build package the app doesn't work when it tried to run a path of the router that use a lazy loaded module. It gives me the following error:

GET http://127.0.0.1:8080/app/modules/FIRST-SECTION/first-section.module 404 (Not Found)

Do you know how can i use lazy loading modules with SystemJS Builder?

smartm0use avatar Nov 06 '16 11:11 smartm0use