Jhipster Angular 2 Lazy Loading Module Not found Exception

Question

I created the Jhipster application and try to add the lazy loading module, which give the module not found exception.

I follow the "https://jaseb.github.io/angular2-example/" article but still the same exception. I try myself. Please help me us to proceed further.Please find the code snippets as follows.

app.route.ts

    import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {NavbarComponent} from "./layouts/navbar/navbar.component";

export const routes: Routes = [
    { path: '', component: NavbarComponent, outlet: 'navbar'},
    { path: 'lazy', loadChildren: 'app/modules/lazy/lazy.module#LazyModule' }
];

@NgModule({
    imports: [ RouterModule.forRoot(routes) ],
    exports: [ RouterModule ]
})
export class AppRoutingModule {
}

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. See the How to Ask page for help clarifying this question. — Roman C
– Roman C, Commented Apr 2, 2017 at 16:34
Hi Roman, When i try to invoke the lazy url pattern it has to lazily as per my code. But am getting "app/modules/lazy/lazy.module" not found exception. When i try to run the application standalone as a angular-cli project its working, but as jhipster project it gives the module not found error. Pls help to identify the case. — praveenkumar annadurai
– praveenkumar annadurai, Commented Apr 2, 2017 at 17:01
I have the same problem with this repo: github.com/dancancro/jhipster-sample-app-ng2/blob/newmodules/… Did you solve it? — Dan Cancro
– Dan Cancro, Commented Apr 24, 2017 at 23:52
I have same problem for load module on routing using lazy loading. — Ashish Kadam
– Ashish Kadam, Commented Jun 18, 2017 at 18:20

Alwan · Accepted Answer · 2017-04-29 19:21:47Z

1

First you must install webpack plugin angular-router-loader

npm install angular-router-loader --save-dev

then in your project directory open webpack/webpack.common.js and add angular-router-loader after awesome-typescript-loader like below

loaders: [
'angular2-template-loader',
'awesome-typescript-loader',
'angular-router-loader' // here
]

path should be without app prefix

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

edited Apr 29, 2017 at 19:21

answered Apr 29, 2017 at 18:37

Alwan

112 bronze badges

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

1 Comment

Ashish Kadam Over a year ago

that's not working, jHipster support lazyloading or not ?

Alberto L. Bonfiglio · Accepted Answer · 2018-06-20 21:59:22Z

0

I was having a similar issue with lazy loading working in a straight angular app. I compared a working app with mine and noticed that I did not have "baseUrl": "./" in my tsconfig.spec.json nor my tsconfig.app.json. Once I added it it started working.

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "baseUrl": "./",  **<-- this was missing**
    "module": "es2015",
    "types": []
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ]
}

Hope this helps

answered Jun 20, 2018 at 21:59

Alberto L. Bonfiglio

1,84125 silver badges40 bronze badges

Collectives™ on Stack Overflow

Jhipster Angular 2 Lazy Loading Module Not found Exception

I follow the "https://jaseb.github.io/angular2-example/" article but still the same exception. I try myself. Please help me us to proceed further.Please find the code snippets as follows.

app.route.ts

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

I follow the "https://jaseb.github.io/angular2-example/" article but still the same exception. I try myself. Please help me us to proceed further.Please find the code snippets as follows.

app.route.ts

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related