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.

Lazy loading of modules giving error

See original GitHub issue

Hi,

I have upgraded to the latest version of Angular CLI - 1.5.4 and Angular 5. I am not able to workout a simple app, which lazily load modules.

Strangely, if I comment some code, the app gets recompiled and works perfectly. Even if I uncomment, what I commented before, it runs smoothly without any error. But if I stop npm and restart my app, I face same issue again.

Is it something at build time?

Angular-CLI - 1.5.4

<!--
ERROR in Error: Could not resolve module src/feature-module-one/feature1.module relative to E:/Build Learn Conquer/tests/testAOTModules/src/app/app.module.ts
    at StaticSymbolResolver.getSymbolByModule (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:31884:30)
    at StaticReflector.resolveExternalReference (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:30350:62)
    at parseLazyRoute (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:28616:55)
    at listLazyRoutes (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:28578:36)
    at visitLazyRoute (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:29995:47)
    at AotCompiler.listLazyRoutes (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler\bundles\compiler.umd.js:29963:20)
    at AngularCompilerProgram.listLazyRoutes (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler-cli\src\transformers\program.js:157:30)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@angular\compiler-cli\src\ngtools_api.js:44:36)
    at AngularCompilerPlugin._getLazyRoutesFromNgtools (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:247:66)
    at Promise.resolve.then.then (E:\Build Learn Conquer\tests\testAOTModules\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:538:50)
    at process._tickCallback (internal/process/next_tick.js:103:7)

webpack: Failed to compile.
-->

Repro steps

Lazily load an angular module
ng serve

Observed behavior

<!-- Normally this includes a stack trace and some more information. -->

Desired behavior

Mention any other details that might be useful (optional)

Issue Analytics

State:
Created 6 years ago
Reactions:12
Comments:23 (4 by maintainers)

Top GitHub Comments

16reactions

Yura13commented, Feb 4, 2018

I found the reason of this error. You should change all lazyload modules in your application like this example (remove .ts): admin.module.ts#AdminModule => admin.module#AdminModule If you change only one parent lazyload module (but not syntax of child lazyload modules), you have the same error related to parent module: Could not resolve module app/admin/admin.module.ts relative to C:/Projects/mean-app/src/app/app-routing.module.ts

But I have a question: Why after any changes and recompile (not stop and typing ng serve) application will start and work? I think the error message needs to show in this case also.

10reactions

AmebaBraincommented, Jul 17, 2018

One obvious addition, relative path (to app-routing.module.ts) should start with dot symbol app/admin/admin.module#AdminModule => ./admin/admin.module#AdminModule

Such form doesn’t work app/admin/admin.module#AdminModule => admin/admin.module#AdminModule

Top Results From Across the Web

Resolving errors faced while implementing Lazy Loading with ...

Below are some errors that I came across while implementing lazy loading modules. Before that, here's what I did to decrease initial page ......

angular - BrowserModule error only on lazy loaded modules

I noticed that the error pages are only those that use lazy loading. Routes declared without lazy loading are functional. I figure the...

Lazy-loading feature modules - Angular

A common error when lazy-loading modules is importing common modules in multiple places within an application. Test for this condition by first generating...

Manually Lazy Load Modules And Components In Angular

Based on this configuration data, multiple modules and/or components need to be lazy-loaded and its routes dynamically added to the application.

Angular Global Error Handling Lazy Loaded Modules

Starter project for Angular apps that exports to the Angular CLI.