angular-cli: ng serve --aot fail after file change

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
- [ ] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

Angular CLI: 6.1.2 Node: 10.0.0 OS: win32 x64 Angular: 6.1.2 … animations, cli, common, compiler, compiler-cli, core, forms … http, language-service, platform-browser … platform-browser-dynamic, platform-server, router … service-worker

Package Version

@angular-devkit/architect 0.7.2 @angular-devkit/build-angular 0.7.2 @angular-devkit/build-optimizer 0.7.2 @angular-devkit/build-webpack 0.7.2 @angular-devkit/core 0.7.2 @angular-devkit/schematics 0.7.2 @angular/cdk 6.4.3 @angular/material 6.4.3 @ngtools/webpack 6.1.2 @schematics/angular 0.7.2 @schematics/update 0.7.2 rxjs 6.2.2 typescript 2.9.2 webpack 4.9.2 –>

Repro steps

  1. run ng serve with aot flag
  2. change something in watch filles
  3. see error in module find(file that change)

The log given by the failure

Module not found: Error: Can't resolve '@angular/material/button.ngfactory' in 'D:\Flare\flare.ui2\src\homeapp\app\components\reports\profitAndLoss'
ERROR in ./src/homeapp/app/components/reports/profitAndLoss/profit.and.loss.ngfactory.js
Module not found: Error: Can't resolve '@angular/material/checkbox.ngfactory' in 'D:\Flare\flare.ui2\src\homeapp\app\components\reports\profitAndLoss'
ERROR in ./src/homeapp/app/components/reports/profitAndLoss/profit.and.loss.ngfactory.js
Module not found: Error: Can't resolve '@angular/material/form-field.ngfactory' in '.\src\homeapp\app\components\reports\profitAndLoss'
ERROR in ./src/homeapp/app/components/reports/profitAndLoss/profit.and.loss.ngfactory.js
Module not found: Error: Can't resolve '@angular/material/menu.ngfactory' in '.\src\homeapp\app\components\reports\profitAndLoss'

Date: 2018-08-09T17:57:03.581Z - Hash: 12b8572033feade48d1a - Time: 34472ms
4 unchanged chunks
chunk {main} main.js (main) 16.2 MB [initial] [rendered]

i 「wdm」: Failed to compile.

Desired functionality

work as before update

Mention any other details that might be useful

I didn’t know where to write, in @angular/compile or here but error showed in cli, so… This breaking from this fix https://github.com/angular/angular/pull/25335. Reverting @angular/compiler to 6.1.1 workaround for this. I tested without fix, it work as before.

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 71
  • Comments: 67 (9 by maintainers)

Commits related to this issue

Most upvoted comments

Added to the top of our backlog

the same, v6.1.2 is broken. downgrade to "@angular/compiler-cli": "6.1.1",

We’re looking at this issue at the moment.

Steps to reproduce:

  • create a new project ng new repro-proj
  • make sure you’re using at least @angular/compiler@6.1.2 or above
  • add RouterModule to src/app/app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { environment } from '../environments/environment';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    RouterModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
  • run ng serve --aot
  • save src/app/app.module.ts (no change in it needed)
  • see the following error:
ERROR in ./src/app/app.module.ngfactory.js
Module not found: Error: Can't resolve '@angular/router.ngfactory' in 'D:\sandbox\latest-project\src\app'

This problem seems to have been introduced in https://github.com/angular/angular/pull/25335, and is the same as reported in https://github.com/angular/angular/issues/25424.

I inspected the contents of src/app/app.module.ngfactory.js and what happens is that in the initial build it contains this import:

import * as i3 from "../../node_modules/@angular/router/router.ngfactory";

but in the rebuild the import is changed to

import * as i3 from "@angular/router.ngfactory";

I checked if the same happens happens with just ngc, and it doesn’t.

Still investigating further.

Hey,

This issue can also reproduce as follows:

Steps:

ng new ngApp --routing && cd ngApp ng serve --aot change a file under watch

Error:

ERROR in ./src/app/app.module.ngfactory.js
Module not found: Error: Can't resolve '@angular/router.ngfactory' in '/Users/vchimev/Work/tmp/ngApp/src/app'
ℹ 「wdm」: Failed to compile.

Causes https://github.com/NativeScript/nativescript-dev-webpack/issues/630.

Fixed via https://github.com/angular/angular/pull/25604, released in @angular/compiler@6.1.6.

After some changes we have 183 ERRORS Most of it

Module not found: Error: Can't resolve '@angular/router.ngfactory' 

and all material components

Still not fixed with 6.1.4 right?

It wasn’t fixed in 6.1.3. I just checked it.

Issue still exists when ng build --aot. Issue still exists when ng serve --aot.

Angular CLI: 7.3.2
Node: 10.0.0
OS: darwin x64
Angular: 7.2.5
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.2
@angular-devkit/build-angular     0.13.2
@angular-devkit/build-optimizer   0.13.2
@angular-devkit/build-webpack     0.13.2
@angular-devkit/core              7.3.2
@angular-devkit/schematics        7.3.2
@angular/cli                      7.3.2
@ngtools/webpack                  7.3.2
@schematics/angular               7.3.2
@schematics/update                0.13.2
rxjs                              6.4.0
typescript                        3.2.4
webpack                           4.29.0

I have the same issue with angular-cli@6.2.5 and compiler@6.1.10

It fails with error Error: ENOENT: no such file or directory, stat '/Users/sergeyf/job/case-management-frontend/src/app/shared/components/cost-center-image/cost-center-image.component.ngfactory.js'

What’s unusual here we use an inline template, not standalone. Might be this a problem?

https://github.com/angular/angular-cli/issues/12260#issuecomment-429831070 this helped me out

@filipesilva Would it be possible to cover this with integration tests in the future, given that it is very easy to reproduce?

If your tsconfig.json has this path. remove and try it. It worked for me.

"paths": { "@angular/*": ["../node_modules/@angular/*"] },

Still having this issue on Angular 7.2 Only with ng build or serve --aot or --prod, I get: .ngfactory.js Module not found Any help? I see a ‘fixed by Ivy’ tag applied - would I have to wait for Ivy?

@JWBrownie If you have this type of error probably you have upgraded from Angular 5 to 6 or 7.

Replace "rootDir": "./src", in your tsconfig.json file to "rootDir": "./", or just remove this parameter completely.

Same here (Angular 6.1.10):

$ ng -v

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


Angular CLI: 6.2.4
Node: 8.11.1
OS: win32 x64
Angular: 6.1.10

Ouput:

i 「wdm」: Compiled successfully.
i 「wdm」: Compiling...
C:\PROJECT_PATH\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:92
                                        throw data[0];
                                        ^

Error: ENOENT: no such file or directory, stat 'C:\PROJECT_PATH\src\app\@shared\sr-only\sr-only.component.ngfactory.js'
    at Object.fs.statSync (fs.js:948:11)

@rickvandermeij-aanzee because it’s in angular, not cli.

Been fighting with this for about a week now. I can confirm this package.json fixes all issues (made with npm i -g @angular/cli@6.1.1 then manually edited):

{
  "name": "admin",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --aot",
    "build": "ng build --aot --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "6.1.1",
    "@angular/common": "6.1.1",
    "@angular/compiler": "6.1.1",
    "@angular/core": "6.1.1",
    "@angular/forms": "6.1.1",
    "@angular/http": "6.1.1",
    "@angular/platform-browser": "6.1.1",
    "@angular/platform-browser-dynamic": "6.1.1",
    "@angular/router": "6.1.1",
    "core-js": "^2.5.4",
    "rxjs": "^6.0.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "0.7.0",
    "@angular/cli": "6.1.1",
    "@angular/compiler-cli": "6.1.1",
    "@angular/language-service": "6.1.1",
    "@types/node": "~8.9.4",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "~2.7.2"
  }
}

^6.1.1 means install the latest version of 6.x (with a minimum of 6.1.1) which would be 6.1.2

As a temporary workaround, you can fix @angular/compiler to 6.1.1 (note you will receive peer dependency warnings). You can also stay on Angular 6.1.1 as a whole until a fix is available. Also when building for production, moving to consistent versions would be advised (i.e., all 6.1.1 or all 6.1.2).

Note also that CLI and @angular-devkit/build-angular can be at their latest version.

For me this issue even with 6.1.1 (6.1.0 all was fine)