module not found: '@angular/router.ngfactory' when use 'tns run android --bundle --env.aot --env.uglify'

[miroslavaivanova]

Tell us about the problem

1. tns create app --ng
2. npm i nativescript-dev-webpack --save-dev
3. npm i nativescript-dev-typescript --save-dev
4. tns run android --bundle --env.aot --env.uglify
5. try to make a change in app/item/item.service.ts
   the following exception will throw:

ERROR in ./app.module.ngfactory.js
Module not found: Error: Can't resolve '@angular/router.ngfactory' in '/Users/user/angApp1/app'
 @ ./app.module.ngfactory.js 10:0-111 10:0-111 27:0-48 49:211-244
 @ ./main.aot.ts

Local environment

• [x ] NativeScript CLI version : 4.2.0

Project data

"dependencies": {
    "@angular/animations": "~6.1.0",
    "@angular/common": "~6.1.0",
    "@angular/compiler": "~6.1.0",
    "@angular/core": "~6.1.0",
    "@angular/forms": "~6.1.0",
    "@angular/http": "~6.1.0",
    "@angular/platform-browser": "~6.1.0",
    "@angular/platform-browser-dynamic": "~6.1.0",
    "@angular/router": "~6.1.0",
    "nativescript-angular": "~6.1.0",
    "nativescript-theme-core": "~1.0.4",
    "reflect-metadata": "~0.1.8",
    "rxjs": "^6.0.0",
    "tns-core-modules": "~4.2.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~6.1.0",
    "@ngtools/webpack": "~6.1.0",
    "nativescript-dev-typescript": "^0.7.2",
    "nativescript-dev-webpack": "^0.15.1",
    "typescript": "~2.7.2"
  }, 

[NathanWalker]

@miroslavaivanova I am also seeing this? Seemed to show up ever since the latest .1 release?

[NathanWalker]

@sis0k0 any insight on this one? You may be doing your talk at ngTalks right this very minutes so whenever/if you see this later :)

[bradmartin]

Same 😢 - hit it initially. Then change a file and it's gone, then it pops back up again. I removed a comment from the app.module.ngfactory.d.ts that was at the top of the file and it seemed to be run webpack fine, then it would fail. However, I don't know enough about the NS+Webpack to know what's going on.

[darkguy2008]

This can also be replicated with a simple angular project with routing included. Run "ng serve --aot" (or edit your package.json) and modify a file and et voilá. Same crappy error, I have the entire afternoon trying to deal with this with no avail.

[vchimev]

Thank you, @darkguy2008!

Reported in angular/angular-cli#11835. Downgrade to @angular/[email protected] as a workaround.

[NathanWalker]

Downgrade sort of works. Ends up resulting in every other file change actually triggering livesync so doesn't work quite as well as it did prior whatever has caused the whole world to break here.
If anyone has a dependency version set which works 100% please post here.

[NathanWalker]

@darkguy2008 @NickIliev we are still seeing every other file change triggering livesync with 6.1.1 pinned angular version, you all seeing the same? Do we know if that for sure is angular related?
Certainly the description in this issue is Angular related but downgrading angular and {N} livesync is still broken to only trigger change (in particular a .html or .css/.scss file change) on every other file change so:

first view file save trggers just fine... 2nd one fails... 3rd one wins... 4th one fails...5th one wins, etc.

/cc @sis0k0

with the following deps:

"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/platform-browser": "6.1.1",
    "@angular/platform-browser-dynamic": "6.1.1",
    "@angular/router": "6.1.1",

and devDeps:

"devDependencies": {
    "@angular/compiler-cli": "6.1.1",
    "@angular-devkit/build-angular": "~0.7.0",
    "@angular/cli": "6.1.1",
    "@angular/language-service": "6.1.1",
"@angular/compiler-cli": "6.1.1",
    "@ngtools/webpack": "~6.1.3",

Possible that ngtools/webpack also needs to be pinned and if so anyone certain that pinning it will make livesync work as normal?

[NathanWalker]

I can confirm that pinning "@ngtools/webpack": "6.1.1", unfortunately does not fix above. Still same issue - every other view/style file change triggers.

[NickIliev]

@NathanWalker the issue with the Can't resolve '@angular/router.ngfactory' error should be resolved by pinning "@angular/compiler" (note that this is not "@angular/compiler-cli" or "@ngtools/webpack" ) to version 6.1.1. Doing that the livesync is working as expected on my side and changes made in TS, CSS or HTML files are respected every time.

Here is my package.json

  "dependencies": {
    "@angular/animations": "~6.1.0",
    "@angular/common": "~6.1.0",
    "@angular/compiler": "6.1.1",
    "@angular/core": "~6.1.0",
    "@angular/forms": "~6.1.0",
    "@angular/http": "~6.1.0",
    "@angular/platform-browser": "~6.1.0",
    "@angular/platform-browser-dynamic": "~6.1.0",
    "@angular/router": "~6.1.0",
    "nativescript-angular": "~6.1.0",
    "nativescript-theme-core": "~1.0.4",
    "reflect-metadata": "~0.1.8",
    "rxjs": "^6.0.0",
    "tns-core-modules": "~4.2.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~6.1.0",
    "@ngtools/webpack": "~6.1.0",
    "nativescript-dev-typescript": "~0.7.0",
    "nativescript-dev-webpack": "^0.15.1",
    "typescript": "~2.7.2"
  }

And here is the test applicaiton I've used to test the livesync.

Angular are releasing a fix for the Can't resolve '@angular/router.ngfactory' issue so we would retest with the new @angular/compiler once the fix is published.

If you are still experiencing troubles with livesync on every other time, please post on what device/platform you are hitting this one - I guess it would be a candidate for opening a new issue as it seems to be a different case not related to this one.

[NathanWalker]

We'll try this and report back today - thank you for that 👍

[NathanWalker]

@NickIliev Unfortunately yeah same thing (every other view/style file change triggers livesync only). Perhaps I can do a brief hangout with you tomorrow to show you?

iOS Simulator iPhoneX 11.4
macOS 10.13.6

[NathanWalker]

Additionally @NickIliev I cloned your issue repo here and ran the project and can see exactly the same livesync problem so it's broken there as well.

Nathans-MacBook-Pro:issue-630 nathan$ node -v
v10.2.1
Nathans-MacBook-Pro:issue-630 nathan$ npm -v
6.4.0

Repro:

• run project with: tns run ios --emulator --bundle --env.aot
• after it launches, just open items.component.html and change ActionBar title to something else and then save.
• console will show:

File change detected. Starting incremental webpack compilation...
Webpack compilation complete. Watching for file changes.
Webpack build done!

And nothing happens. Save again and it will livesync. Save again and same thing so exactly the problem I describe above.

[darkguy2008]

Hi guys

Working with an old project, I found a combination that worked. Here's my package.json file without any issues and using --aot:

{
	"name": "app-web",
	"version": "0.0.0",
	"scripts": {
		"ng": "ng",
		"start": "ng serve --aot",
		"build": "ng build --aot --prod",
		"lint": "ng lint"
	},
	"private": true,
	"dependencies": {
		"@angular/animations": "^6.0.3",
		"@angular/common": "^6.0.3",
		"@angular/compiler": "^6.0.3",
		"@angular/core": "^6.0.3",
		"@angular/forms": "^6.0.3",
		"@angular/http": "^6.0.3",
		"@angular/platform-browser": "^6.0.3",
		"@angular/platform-browser-dynamic": "^6.0.3",
		"@angular/router": "^6.0.3",
		"bootstrap": "^4.1.1",
		"core-js": "^2.5.4",
		"font-awesome": "^4.7.0",
		"jquery": "^3.3.1",
		"popper.js": "^1.14.3",
		"rxjs": "^6.0.0",
		"zone.js": "^0.8.26"
	},
	"devDependencies": {
		"@angular/compiler-cli": "^6.0.3",
		"@angular-devkit/build-angular": "~0.6.8",
		"typescript": "~2.7.2",
		"@angular/cli": "~6.0.8",
		"@angular/language-service": "^6.0.3",
		"@types/node": "~8.9.4",
		"codelyzer": "~4.2.1",
		"ts-node": "~5.0.1",
		"tslint": "~5.9.1"
	}
}

[NathanWalker]

@darkguy2008 referring to 2 different issues here - I may need to break the issue I mention out as it's different than description here. Refer to these comments specifically:
#630 (comment)
#630 (comment)
Additionally your package is a web project but we're talking specifically about {N} projects here.

[NathanWalker]

I went ahead and created separate issue to track what I'm referring to here to avoid confusion:
#641

[darkguy2008]

@NathanWalker alright, thanks for your input. Actually that issue was fixed with @angular/compiler-cli 6.1.6 released today, so I'd say that part of the issue could be already solved.

[NickIliev]

@darkguy2008 thank you for the update!

@miroslavaivanova @NathanWalker @bradmartin I can confirm that indeed the latest version of @angular/compiler-cli (6.1.6) has resolved the issue. (tested via this app)

To update the projects to use the latest version of @angular/compiler-cli delete the node_modules folder and run the upgrade scripts and then rerun npm i (or just manually upgrade the compiler-cli version)