Angular-cli: Build is not kicking off in a browser on save

[kuncevic]

OS

Windows 10.

Versions.

angular-cli: 1.0.0-beta.28.3
node: 6.9.2
os: win32 x64
@angular/common: 2.4.5
@angular/compiler: 2.4.5
@angular/core: 2.4.5
@angular/flex-layout: 2.0.0-beta.4
@angular/forms: 2.4.5
@angular/http: 2.4.5
@angular/material: 2.0.0-beta.1
@angular/platform-browser: 2.4.5
@angular/platform-browser-dynamic: 2.4.5
@angular/router: 3.4.5
@angular/compiler-cli: 2.4.5

Repro steps.

Migrate from beta.24 to beta.28.3
Modify any file
Click save
Chrome dev console saying:

[WDS] App updated. Recompiling...
[WDS] Nothing changed.

The new build is not kicking off

So had to stop and reastart ng serve manually

[BondiGeek]

Same issue here.

[idc1407]

same issue here

[jwuliger]

Hello. I am having the same problem. Every change I make to ANY file causes me to end the command and do ng serve just to see the changes.

[ramesh-yadav]

Same issue. Recompile is not working properly.

And you are showing that next release will be production release.

[ghost]

Hello, I have the same issue but ONLY with pipes, version beta 26

[abeagley]

Same issue here on Win 10

[danielsogl]

Beta 28 is broken af...

[WouterSpaak]

This issue seems to affect new .ts files or changes in any .ts files as well. Template changes in .html files update, but underlying script files do not.

[leonelgoncalves]

im having this same issue in win10

[dev]

Same issue here...

[Meligy]

Anybody tried beta 29?

[Meligy]

Note that beta 29 comes with a new package name @angular/cli instead of angular-cli.

[PierreDuc]

@angular/cli has the same problem. Changes are not detected. Especially difficult when a full rebuild takes more than 30 seconds

[PierreDuc]

Anybody else having a hard time reverting back to beta 26? I've gotten so far as to remove all node_modules global, local and cache and reverting to what I know was a working state of my project, but still no changes are detected when I run ng serve.

[Meligy]

hmm..

On Mac OS latest and NPM 6.x latest, I was able to get a new beta.29 project to detect changes to:

• A pipe used in app.component.html (details: https://github.com/angular/angular-cli/issues/4336#issuecomment-276911060)
• app.component.html itself
• The title property in app.component.ts

Could this be OS related or upgrade related?

Any concrete steps to reproduce on a new project?

[dev]

npm install --save @ngtools/[email protected]
seems to have fixed it for me.
thanks to @beeman for his solution in #4329.

[Meligy]

That explains why it works for me. The version I get on a new project is @ngtools/[email protected].

[intellix]

Yep. There was an issue previously with webpack 1.2.5 which was fixed in 1.2.6 a couple of hours ago. A new angular-cli wasn't released, just a new version of @ngtools/webpack, so make sure you've got that guys

[PierreDuc]

Well, that explains why reverting to an old version doesn't work. Older cli versions will still download the new webpack version

[aprades]

It still doesn't work for me. Started new project, and still same issue.

angular-cli: 1.0.0-beta.28.3
node: 6.9.5
os: win32 x64
@angular/common: 2.4.5
@angular/compiler: 2.4.5
@angular/core: 2.4.5
@angular/forms: 2.4.5
@angular/http: 2.4.5
@angular/platform-browser: 2.4.5
@angular/platform-browser-dynamic: 2.4.5
@angular/router: 3.4.5
@angular/compiler-cli: 2.4.5
@ngtools/webpack: 1.2.6

[dev]

@aprades cd to your project and run npm install --save @ngtools/[email protected] in that directory

[aprades]

Ok, it doesn't work with @ngtools/[email protected]

With @ngtools/[email protected] it works fine.

[dev]

Great @aprades!

[niklas-dahl]

I freshly installed angular-cli npm uninstall -g angular-cli && npm i -g angular-cli and im getting the following warnings:

npm WARN optional Skipping failed optional dependency /angular-cli/chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: [email protected]
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none was installed.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none was installed.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none was installed.
npm WARN @angular/[email protected] requires a peer of rxjs@^5.0.1 but none was installed.
npm WARN @angular/[email protected] requires a peer of zone.js@^0.7.2 but none was installed.

Trying ng --version gives me a lot of Cannot find module 'reflect-metadata' Errors.
Is this related to the restructuring of the cli packages?

Previously it worked just fine.

[RicardoVaranda]

@niklas-dahl The new npm name for the project is @angular/cli try:

npm install -g @angular/cli

[lukichev]

Thanks, @legit . Installing @ngtools/[email protected] resolved my issue.

[niklas-dahl]

@RicardoVaranda that worked, but installing angular-cli should still work I guess,,

[RicardoVaranda]

@niklas-dahl I believe it installs beta 28.3 instead of 29 if you use angular-cli.

[emazv72]

Same as #4355 but replacing angular-cli: 1.0.0-beta.28.3 with @angular/cli: 1.0.0-beta.29

$ npm show @ngtools/webpack version
1.2.6

[MickL]

I don't see any release for beta 29. Latest is 28. How can this work?

[hneuer]

@MickL try this: https://www.npmjs.com/package/@angular/cli

[MickL]

Is this issue fixed for beta 29?

[hneuer]

I dont know, I just wanted to point you to the current beta

[aprades]

I don't have the issue with beta 29.
The install procedure has changed a bit:
npm install -g @angular/cli@latest

[jloosli]

For what it's worth, it still doesn't work in beta 29 for me, but reverting to @ngtools/[email protected] does work

[web-dave]

ng v

angular-cli: 1.0.0-beta.28.3
node: 6.9.2

os: win32 x64

npm uninstall -g angular-cli
npm cache clean
npm i -g @angular/cli@latest
...

ng v

@angular/cli: 1.0.0-beta.29
node: 6.9.2

os: win32 x64

ng new multimodule --routing--style=scss

cd multimodule

npm i -S @ngtools/[email protected]

Works fine!

[kuncevic]

I've got in to another trouble https://github.com/angular/angular-cli/issues/4380 after migrating my current project from beta.28.3 to beta.29
So I just rolled back to beta.28.3 for now + npm install @ngtools/[email protected] on top of it

[kuncevic]

Just tested with beta.30 which is coming with @ngtools/[email protected] is still having the the same issue.

[WDS] App updated. Recompiling...
[WDS] Nothing changed.

npm install @ngtools/[email protected] do not helps with beta.30
I am back to beta.28.3 + npm install @ngtools/[email protected] again.

[emazv72]

@kuncevic same issue here, npm clean, reinstalled beta.30 and tested on a new blank project.
Major issue, I'm going to revert to beta.28.3
Too bad because performance improved a lot in the last cycle.

[raducostea]

For me, right now it only works with "@angular/[email protected]" and @ngtools/[email protected]

[MarkWilsoncom]

@web-dave: tried your fix and now get the following on calling ng serve:

Cannot find module 'rxjs/symbol/observable'
Error: Cannot find module 'rxjs/symbol/observable'
at Function.Module._resolveFilename (module.js:469:15)
at Function.Module._load (module.js:417:25)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at globalScope (C:\Users\Media\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular\core\bundles\core.umd.js:7:85)
at Object. (C:\Users\Media\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular\core\bundles\core.umd.js:10:2)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
........
Output from ng v:

@angular/cli: 1.0.0-beta.30
node: 6.9.4
os: win32 x64
@angular/common: 2.4.6
@angular/compiler: 2.4.6
@angular/core: 2.4.6
@angular/forms: 2.4.6
@angular/http: 2.4.6
@angular/platform-browser: 2.4.6
@angular/platform-browser-dynamic: 2.4.6
@angular/router: 3.4.6
@angular/compiler-cli: 2.4.6
@ngtools/webpack: 1.2.4

[grunk]

@MarkWilsoncom did you update your package.json with the modified name ?
"angular-cli": "^1.0.0-beta.28.3", becomes "@angular/cli": "1.0.0-beta.30",

@raducostea "@angular/[email protected]" and @ngtools/[email protected] did not work for me (win 10 , node 6.9.5)

[cassianomon]

"@ngtools/webpack": "1.2.4" worked here

[MarkWilsoncom]

@grunk: no - good point.
Just updated and still get the same error.

Dependencies in package.json:

"dependencies": {
"@angular/common": "^2.3.1",
"@angular/compiler": "^2.3.1",
"@angular/core": "^2.3.1",
"@angular/forms": "^2.3.1",
"@angular/http": "^2.3.1",
"@angular/platform-browser": "^2.3.1",
"@angular/platform-browser-dynamic": "^2.3.1",
"@angular/router": "^3.3.1",
"@ngtools/webpack": "^1.2.4",
"core-js": "^2.4.1",
"rxjs": "^5.0.1",
"ts-helpers": "^1.1.1",
"zone.js": "^0.7.2"
},
"devDependencies": {
"@angular/compiler-cli": "^2.3.1",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.42",
"angular-cli": "1.0.0-beta.30",
"codelyzer": "~2.0.0-beta.1",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "2.5.0",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-remap-istanbul": "^0.2.1",
"protractor": "~4.0.13",
"ts-node": "1.2.1",
"tslint": "^4.3.0",
"typescript": "~2.0.3"
}

Just trying to get a really basic example up and running...

[raducostea]

@MarkWilsoncom
npm uninstall angular-cli --save
npm install @angular/cli@lastest --save
npm install @ngtools/[email protected] --save

This worked for me.

[RicardoVaranda]

Make sure you delete your node_modules folder within your projects also, this step is often overlooked.

[kuncevic]

@MarkWilsoncom "angular-cli": "1.0.0-beta.30", should be "@angular/cli": "1.0.0-beta.30", in your package.json then try rimraf node_modules and npm install

[MarkWilsoncom]

@raducostea : thx - works!
@kuncevic: hmm - only thing I thought manually changed was "30"... thx anyway

Just getting started with angular 2 - great to see a helpful and responsive community - thx people :-)

[cassianomon]

It need to be "@ngtools/webpack": "1.2.4" at package.json and NOT "@ngtools/webpack": "^1.2.4"

[emazv72]

package.json temporary fix for beta.30

"devDependencies": {
"@angular/cli": "1.0.0-beta.30",
...
"@ngtools/webpack" : "1.2.4"
}

Looks like something is broken after 1.2.4

[rkajbaf]

Downgrading @ngtools/webpack to 1.2.4 works for me as well.

Windows 10, node 6.9.4, beta30

[web-dave]

beside all the error confimations. Compiling is damn fast!!!
💋

[JiriBalcar]

@web-dave Maybe it is damn fast because it does not compile any typescript ;-)

[web-dave]

i mean with the fixed compiling!! (@ngTools/[email protected])

[JiriBalcar]

Yes but with @ngtools/[email protected] the lazyloaded bundles are not generated if you use import * as somewhere in your code (even in node_modules).

[ctrl-brk]

I haven't noticed any significant speed increase.

[raducostea]

I can see an about 2s improvement. I get a 2-3 seconds build time on save. Previously i was getting 4-5 seconds before.

[MickL]

When will there be a release? Im waiting for this every day :)

[raducostea]

This was already fixed for me in the latest @angular/cli

[MickL]

In beta 30? I didn't see it in the changelog tho.

[raducostea]

https://github.com/angular/angular-cli/commit/9fcf10a89b0995c2da606fbbe5a341d42044654b

I removed node_modules, i've ran npm install and https://github.com/angular/angular-cli/commit/9fcf10a89b0995c2da606fbbe5a341d42044654b is present in the build already.

[MickL]

In master, but not in beta 30 :/

[JiriBalcar]

It is in latest @ngtools/webpack. And I think, that @angular/cli always
install the latest version.

On Mon, Feb 6, 2017, 13:22 Mick Lawitzke [e-mail] wrote:

In master, but not in beta 30 :/

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/4338#issuecomment-277665943,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGkHslaLKr8liugoiDDtFgnT772_0td6ks5rZxBxgaJpZM4L0s2T
.

[abdo0]

Thanks @legit for solving my issue

[slubowsky]

Seems to be fixed for dev mode but still broken if use ng --aot --prod (didn't try just one).

Using a number that I keep incrementing to see what gets displayed it looks like somehow its serving up what was two compilations behind. i.e. starting at 0 at incrementing by 1, I see 1 when last saved and compiled change was 3, and 2 when last change was 4, etc..

[ulymor]

I faced with the same problem on Ubuntu 16.04 and angular CLI 1.0.0-beta.30

The problem was related with Inotify Watches Limit on Linux.
To solve to issue I increased the watches limit to 512K

sudo sysctl fs.inotify.max_user_watches=524288
sudo sysctl -p --system

After that I restarted my IDE (WebStorm in my case) and after that the change detection started to work.

[AlainD-]

@ulymor you'd probably be interested in this comment https://github.com/angular/angular-cli/issues/2389#issuecomment-278913860 :-), as apparently modifying the inotify settings as so would use a large amount of RAM for nothing.

[lihaibh]

installing"@ngtools/webpack": "1.2.4" does work but the compilation is extreamly slow, why?

[crosma]

I'm still experiencing this issue. I'm building an a freshly updated Rasberry Pi 3 Model B.

@angular/cli: 1.0.0
node: 7.8.0
os: linux arm
@angular/cli: 1.0.0
@angular/common: 4.0.1
@angular/compiler: 4.0.1
@angular/compiler-cli: 4.0.1
@angular/core: 4.0.1
@angular/forms: 4.0.1
@angular/http: 4.0.1
@angular/platform-browser: 4.0.1
@angular/platform-browser-dynamic: 4.0.1
@angular/router: 4.0.1
@ngtools/webpack: 1.3.0

It always catches that a file changes and rebuilds and sometimes works but eventually stops reflecting changes browser side. Once it stops working, it requires restarting ng serve to fix it.

[sandangel]

same issue here:
OS: Arch Linux
@angular/cli: 1.0.0
package.json { "name": "client", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/common": "^4.0.0", "@angular/compiler": "^4.0.0", "@angular/core": "^4.0.0", "@angular/forms": "^4.0.0", "@angular/http": "^4.0.0", "@angular/platform-browser": "^4.0.0", "@angular/platform-browser-dynamic": "^4.0.0", "@angular/router": "^4.0.0", "core-js": "^2.4.1", "rxjs": "^5.1.0", "zone.js": "^0.8.4" }, "devDependencies": { "@angular/cli": "1.0.0", "@angular/compiler-cli": "^4.0.0", "@types/jasmine": "2.5.38", "@types/node": "~6.0.60", "codelyzer": "~2.0.0", "jasmine-core": "~2.5.2", "jasmine-spec-reporter": "~3.2.0", "karma": "~1.4.1", "karma-chrome-launcher": "~2.0.0", "karma-cli": "~1.0.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "karma-coverage-istanbul-reporter": "^0.2.0", "protractor": "~5.1.0", "ts-node": "~2.0.0", "tslint": "~4.5.0", "typescript": "~2.2.0" } }

[themroc5]

I had the same issue but got it working!

My setup: A virtual machine running Linux with shared folders to Windows, coding in PhpStorm.
My solution: In PhpStorm disabling the option _Use "safe write"_ under _Appearance / System Settings_

[aaronhoffman]

Thought I should add this here. This is an open PR linked to by other issues similar to this one. It may contain a resolution for others still having this issue. https://github.com/angular/angular-cli/pull/4009

[abalad]

@themroc5 Thank you. It was well this problem that was also happening through WebStorm, now it worked.

[Bsujeet]

hey i am new to angular just created new project as told in quick start.
But ng serve is not recompiling.
i tried all the things that are mentioned above.
but still not working,
My current version of @angular/cli is 1.1.1 and webpack is 1.4.

when i install webpack 1.2.4 it gives error while compiling.

[nitinshk1111]

I am also facing the same issue. ng serve is not getting reloaded when changes made in a particular directory Model. Apart from those Model classes it is detecting the changes..
I ran the command ng --version and got this result..

@angular/cli: 1.3.2
node: 6.11.2
os: win32 x64
@angular/animations: 4.4.3
@angular/cdk: 2.0.0-beta.11
@angular/common: 4.4.3
@angular/compiler: 4.4.3
@angular/core: 4.4.3
@angular/forms: 4.4.3
@angular/http: 4.4.3
@angular/material: 2.0.0-beta.11
@angular/platform-browser: 4.4.3
@angular/platform-browser-dynamic: 4.4.3
@angular/router: 4.4.3
@angular/cli: 1.3.2
@angular/compiler-cli: 4.4.3
@angular/language-service: 4.4.3

Please help me to fix this issue..

[mhyeganeh]

@themroc5 Thank you very much! After two days spending on this problem, finally solved and I had no idea it was all about phpStrom !

[web-dave]

@mhyeganeh I find this issue very often in my workshops.

[chapultepec]

sudo ng serve works for me!

[clydin]

@chapultepec Please do not repeatedly cross-post the same message.

Also, advocating running a command as root as a general solution opens up the user to potential security implications. sudo should only be used when root permissions are absolutely required.

[chapultepec]

@clydin sorry i was trying to help because the issue is repeated.
So if using sudo is not the best solution wich could be the solution?

[angular-automatic-lock-bot[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._}