Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Error lazy loading when using ng build --prod

See original GitHub issue

Bug Report or Feature Request (mark with an `x`)

- [x ] bug report -> please search issues before submitting
- [ ] feature request

Versions.

@angular/cli: 1.1.0 node: 6.10.3 os: win32 x64 @angular/animations: 4.1.3 @angular/common: 4.1.3 @angular/compiler: 4.1.3 @angular/core: 4.1.3 @angular/forms: 4.1.3 @angular/http: 4.1.3 @angular/platform-browser: 4.1.3 @angular/platform-browser-dynamic: 4.1.3 @angular/platform-server: 4.1.3 @angular/router: 4.1.3 @angular/cli: 1.1.0 @angular/compiler-cli: 4.1.3 @angular/language-service: 4.1.3

Repro steps.

Implement lazy-loading
Build using ‘ng build --prod’

The log given by the failure.

ERROR Error: Uncaught (in promise): Error: Cannot find module ‘app/modules/dashboard/dashboard.module’. Error: Cannot find module ‘app/modules/dashboard/dashboard.module’. at l (main.4372417….bundle.js:1) at t.loadAndCompile (vendor.9485d4a….bundle.js:379) at t.load (vendor.9485d4a….bundle.js:379) at t.loadModuleFactory (vendor.9485d4a….bundle.js:428) at t.load (vendor.9485d4a….bundle.js:428) at e.project (vendor.9485d4a….bundle.js:428) at e.XO5T.e._tryNext (vendor.9485d4a….bundle.js:900) at e.XO5T.e._next (vendor.9485d4a….bundle.js:900) at e.next (vendor.9485d4a….bundle.js:900) at e.RRVv.e._subscribe (vendor.9485d4a….bundle.js:739) at l (main.4372417….bundle.js:1) at t.loadAndCompile (vendor.9485d4a….bundle.js:379) at t.load (vendor.9485d4a….bundle.js:379) at t.loadModuleFactory (vendor.9485d4a….bundle.js:428) at t.load (vendor.9485d4a….bundle.js:428) at e.project (vendor.9485d4a….bundle.js:428) at e.XO5T.e._tryNext (vendor.9485d4a….bundle.js:900) at e.XO5T.e._next (vendor.9485d4a….bundle.js:900) at e.next (vendor.9485d4a….bundle.js:900) at e.RRVv.e._subscribe (vendor.9485d4a….bundle.js:739) at u (polyfills.74eef9a….bundle.js:43) at u (polyfills.74eef9a….bundle.js:43) at polyfills.74eef9a….bundle.js:43 at t.invokeTask (polyfills.74eef9a….bundle.js:36) at Object.onInvokeTask (vendor.9485d4a….bundle.js:365) at t.invokeTask (polyfills.74eef9a….bundle.js:36) at r.runTask (polyfills.74eef9a….bundle.js:36) at o (polyfills.74eef9a….bundle.js:36) at <anonymous>

Desired functionality.

The module should be lazy loaded in the same way as using ‘ng serve’

Mention any other details that might be useful.

Further investigation seems pointing to a clue: it seems to use SystemJsNgModuleLoader to load the module using ‘app/modules/dashboard/dashboard.module’ whereas the module is registered as ‘app/modules/dashboard/dashboard.module.ngfactory’.

This leads to inability to load the module.

Issue Analytics

State:
Created 6 years ago
Comments:7 (3 by maintainers)

Top GitHub Comments

6reactions

montella1507commented, Jun 5, 2017

@MarbleDaemon can you paste your package.json? I guess your problem occurs when you use a library not compatible with AOT. Lika angular2-busy

0reactions

angular-automatic-lock-bot[bot]commented, Sep 7, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

Top Results From Across the Web

Angular lazy loading not working with ng build --prod

but when building with the command 'ng build --prod' the lazy loading modules are not generated. Thoses are the routing modules :.

ng build - Angular

Option Description Value Type Default Value ‑‑aot Build using Ahead of Time compilation. boolean true ‑‑base‑href Base url for the application being built. string ‑‑delete‑output‑path Delete...

Lazy loading with Angular 6.1, error with ng build-angular.js

solution: user ng build --deploy-url /static/dist/ where '/static/dist/' is the location where the files get compiled. Jehob 81. Source: stackoverflow.com ...

Common Chunk and Lazy Loading in Angular - | juri.dev

The easiest way of applying lazy loading is to use the Angular Router's built-in functionality. const routes: Routes = [ { path: 'products', ......

The Complete Guide To Angular Load Time Optimization

“Just use lazy loading”; “Check your bundle sizes”; “Just use Angular Universal” ... is only imported in the footer module or we will...