Lazy loading in AOT doesn't work in 7.1.0-beta.1

[alan-agius4]

Bug Report or Feature Request (mark with an x)

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

Command (mark with an x)

- [ ] new
- [X] build
- [X] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 7.1.0-beta.1
Node: 11.1.0
OS: darwin x64
Angular: 7.1.0-beta.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.0-beta.1
@angular-devkit/build-angular     0.11.0-beta.1
@angular-devkit/build-optimizer   0.11.0-beta.1
@angular-devkit/build-webpack     0.11.0-beta.1
@angular-devkit/core              7.1.0-beta.1
@angular-devkit/schematics        7.1.0-beta.1
@angular/cli                      7.1.0-beta.1
@ngtools/webpack                  7.1.0-beta.1
@schematics/angular               7.1.0-beta.1
@schematics/update                0.11.0-beta.1
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.23.1
    

Repro steps

1. Create a new project
2. Create a lazy module
3. Run an AOT serve or build.

The log given by the failure

Build succeed but fails during runtime when navigating to the lazy route you will get an error

 Error: Uncaught (in promise): Error: Cannot find module './lazy/lazy.module.ngfactory'
Error: Cannot find module './lazy/lazy.module.ngfactory'

Desired functionality

Lazy loading in AOT works.

[danielpcampagna]

I`m still having this problem. Its fix already was release?

> ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 7.1.4
Node: 11.3.0
OS: win32 x64
Angular: 7.0.3
... animations, cdk, common, compiler, compiler-cli, core, forms
... http, language-service, material, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.10.5
@angular-devkit/build-angular     0.10.5
@angular-devkit/build-optimizer   0.10.5
@angular-devkit/build-webpack     0.10.5
@angular-devkit/core              7.1.4
@angular-devkit/schematics        7.1.4
@angular/cli                      7.1.4
@angular/flex-layout              7.0.0-beta.19
@ngtools/webpack                  7.0.5
@schematics/angular               7.1.4
@schematics/update                0.11.4
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.19.1

Repro steps

1. Create a new project

2. Create a lazy module

I'm using this app.routing.ts:

import { Routes, RouterModule, PreloadAllModules  } from '@angular/router';
import { ModuleWithProviders } from '@angular/core';

export const routes: Routes = [
    { path: '', loadChildren: './pages/dashboard/dashboard.module#DashboardModule', data: { breadcrumb: 'Dashboard' } },
    { path: '**', redirectTo: '', pathMatch: 'full'},
];

export const routing: ModuleWithProviders = RouterModule.forRoot(routes, {
   preloadingStrategy: PreloadAllModules
});

3. Run an AOT serve or build.

Call build/serve using --aot

> ng serve --aot

And, then, get an error on your browser console:

ERROR Error: Uncaught (in promise): Error: Cannot find module './pages/dashboard/dashboard.module'
Error: Cannot find module './pages/dashboard/dashboard.module'
    at $_lazy_route_resource lazy namespace object:23
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:14143)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:14134)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:14134)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)

[kylephughes]

I was also getting these errors when executing a prod build with AOT and using lazy loaded modules.
I upgraded the @angular/cli from 7.3.6 to 7.3.8 and it magically started compiling correctly.

"devDependencies": {
"@angular-devkit/build-angular": "~0.13.8",
"@angular/cli": "~7.3.8",
"@angular/compiler-cli": "~7.2.12",

[angular-automatic-lock-bot]

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.}