Problem in Lazy Loading.

[carelessv]

ERROR in ./src/$$_lazy_route_resource lazy
Module not found: Error: Can't resolve 'C:/Projects/Tax/Source/Tax/POC/poc1/Tax.AngularApp/src/app/tax-returns/v2018/dummy.module.ngfactory.js' in 'C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src$$_lazy_route_resource'
resolve 'C:/Projects/Tax/Source/Tax/POC/poc1/Tax.AngularApp/src/app/tax-returns/v2018/dummy.module.ngfactory.js' in 'C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src$$_lazy_route_resource'
using description file: C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\package.json (relative path: ./src/$$_lazy_route_resource)
Field 'browser' doesn't contain a valid alias configuration
after using description file: C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\package.json (relative path: ./src/$$_lazy_route_resource)
using description file: C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\package.json (relative path: ./src/app/tax-returns/v2018/dummy.module.ngfactory.js)
no extension
Field 'browser' doesn't contain a valid alias configuration
C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js doesn't exist
.ts
Field 'browser' doesn't contain a valid alias configuration
C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js.ts doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js.js doesn't exist
as directory
C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js doesn't exist
[C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js]
[C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js.ts]
[C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js.js]
[C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ngfactory.js]
@ ./src/$$_lazy_route_resource lazy
@ ./node_modules/@angular/core/esm5/core.js
@ ./src/main.ts
@ multi ./src/main.ts

Versions

Angular CLI: 1.6.0
Node: 6.10.1
OS: win32 x64
Angular: 5.2.6
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
@angular/cli: 1.6.0
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.28
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.0
@schematics/angular: 0.1.17
typescript: 2.4.2
webpack: 3.10.0

Repro steps

Trying to Lazy Load a module.
Files are as follows:-

app.routing.ts =>

import { ModuleWithProviders } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TaxretrunlistComponent } from './tax-returns/taxretrunlist.component';

const routes: Routes = [

{ path: 'tax/TaxReturns', component: TaxretrunlistComponent },
{ path: 'tax/TaxReturn/:id', loadChildren:'../app/tax-returns/v2018/dummy.module#DummyModule' }
//{ path: 'tax/TaxReturn/:id', component: ClientReturnComponent }

];

export const routing: ModuleWithProviders = RouterModule.forRoot(routes);

dummy.module.ts=>
import { NgModule } from '@angular/core';

import { DummyComponent } from './dummy.component';
import { lazyRouting } from './dummy.routing';

@NgModule({
imports: [lazyRouting],
declarations: [DummyComponent]
})
export class DummyModule {

}
dummy.component.ts=>
import { Component } from '@angular/core';

@component({
selector:'',
template: '

Lazy Dummy Component

'
})
export class DummyComponent {}

dummy.routing.ts=>

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

import { DummyComponent } from './dummy.component';

const routes: Routes = [
{ path: '', component: DummyComponent }
];

export const lazyRouting: ModuleWithProviders = RouterModule.forChild(routes);

Observed behavior

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

Desired behavior

Lazy Routing should be implemented.

Mention any other details that might be useful (optional)

[carelessv]

it gives a strange behavior like:-

1. with 'ng serve' - It first shows an error as follows:-

ERROR in ./src/app/tax-returns/v2018/dummy.module.ts
Module build failed: Error: C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\src\app\tax-returns\v2018\dummy.module.ts is not part of the compilation output. Please check the other error messages for details.
at AngularCompilerPlugin.getCompiledFile (C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\node_modules@ngtools\webpack\src\angular_compiler_plugin.js:648:23)
at plugin.done.then (C:\Projects\Tax\Source\Tax\POC\poc1\Tax.AngularApp\node_modules@ngtools\webpack\src\loader.js:467:39)
at process._tickCallback (internal/process/next_tick.js:109:7)
@ ./src/$$_lazy_route_resource lazy
@ ./node_modules/@angular/core/esm5/core.js
@ ./src/main.ts
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

but when I add even a space and rebuild , the error goes away.

2. in ng build --prod --base-href./ - its gives an error as discussed above.

---

Initially i was using 1.7 version of CLI but later i downgraded to 1.6 but still the problem persists.
Struggling for 3 days and even now don't have clue how to resolve it .

[carelessv]

@clydin - was it a hint ??

[filipesilva]

Thanks for reporting this issue. This issue was originally reported a long time ago and since then we've had many releases, one of which might have addressed this problem. Please update to the most recent Angular CLI version.

If the problem persists after upgrading, please open a new issue, provide a simple repository reproducing the problem, and describe the difference between the expected and current behavior.

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