[angular] ng serve not detecting file changes automatically

I need to run ng serve every time when any changes made to the source files.I have no error in the console.

Angular CLI: 1.6.2
Node: 8.9.1
OS: linux ia32
Angular: 5.1.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.2-c3d7cd9
@angular/cli: 1.6.2
@angular/material: 5.0.3-e20d8f0
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.2
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

This question is related to angular

The answer is


For me what worked was:

rm -rf node_modules && npm install

And then

ng serve


Doing the sudo ng serve command is a bad practice. You have to change the npm permission so that every time if you have to install some npm packages you don't have to use sudo.

This link can solve how to change npm permission to the current user and after following through this steps after you set the npm permission you can remove the node_modules folder from your project directory and use npm install. After completion of packages installation you can run ng serve and you don't have to do sudo ng serve every time you want to run your angular project.


I don't recommend changing SO parameters. I've experienced some (lag) issues after changing fs.inotify.max_user_watches parameter since you will have other services running...

The "ng serve --poll=2000" is a good solution but you will probably forget this parameter...

Investigating: https://github.com/angular/angular-cli/wiki/angular-cli I'd done the following solution.

Changed de angular.json with poll parameter

"serve": {
   "builder....
   "options": {
        "browserTarget": "xkcd:build",
        "poll": 2000
   }
   ...

Works on My Machine :D


Consider that, when having a large number of files, there is a Limit at INotify Watches on Linux. So increasing the watches limit to 512K, for example, can solve this.

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

Note that the previous causes an in-memory change that you will lose after restart.

However, you can make it persistent, by executing:

echo fs.inotify.max_user_watches=524288 | sudo tee /etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system

As a reference, you can check: https://github.com/angular/angular-cli/issues/8313#issuecomment-362728855 and https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers


Only need to run sudo ng serve to resolve the issue.


use sudo before ng serve it will work. In terminal type : 'sudo ng serve'


try this. If you do like this you don't need to fire always any command You need to fire only one time

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

cat /proc/sys/fs/inotify/max_user_watches

fs.inotify.max_user_watches=524288

If all else fails, check your code for syntax errors - particularly on index.html, or parts of your code you recently edited just before this auto update broke. Syntax errors will break this auto update functionality in Angular.

In my case, I had multiple projects open in separate VS Code windows. On all my other projects, ng serve worked as expected: it auto updated on save. But on one project it would require a manual refresh to update. It ended up being because I had html comments outside of the defined HTML area of the template (so, the HTML comments came before <!doctype html>. So it was invalid bc it's HTML syntax outside of an HTML area.

I erased the comments and bam, auto update started working again (after one more manual refresh).

So go through index.html or other parts of your code you recently edited before this broke and one by one, cut sketchy parts out, do a refresh in the browser, then come back to VS Code and make a change, save and see if it auto updates.


In my case on Mac it was fixed by granting Read/Write permission to logged on user to /usr/local/lib


ng serve --poll=2000

Working fine in linux and windows


I would like to leave my case here, just for reference. In my case, the problem was on the system permissions. I used a shared folder inside a VM as a repo. I had no other message like permission denied or something. Tried everything and then I just realized that I was using a network drive.


Didn't work for me:

ng serve --watch

Try :

sudo ng serve

this worked for me!


My answer may not be useful. but I search this question because of this.

After I bought a new computer, I forget to set auto save in the editor. Therefore, the code actually keep unchanged.


You can try this too.

sudo ng serve

Restarting the server worked for me.


Because of, The system that detects changes can't handle so much watches by default.

And the solution is to change the amount of watches it can handle (the maximum amount of files that will be in the project) you must run this command:

echo 65536 | sudo tee -a /proc/sys/fs/inotify/max_user_watches

The problem with inotify is reseting this counter every time you restart your computer.


In your project dist folder is own by root

Try to use sudo ng serve instead of ng serve.

Another solution

When there is having a large number of files watch not work in linux.There is a Limit at INotify Watches on Linux. So increasing the watches limit

//When live server not work in linux

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

ng serve //You can also do sudo **ng serve**

I discovered that the dist/ folder in the project was owned by root. That is why sudo ng serve does see the changes when ng serve does not.

I removed the dist/ folder sudo rm -R dist/ and rebuild it as current user by starting the dev server ng serve and all worked again.


Giving full permission for the project folder worked for me


I was having this problem on a new Linux Ubuntu install and noticed I was getting an error about 'too many watchers for limit' in VSCode at the same time. I followed the instructions to fix it in VSCode and it also fixed the issue with ng watch. More info here https://code.visualstudio.com/docs/setup/linux#_visual-studio-code-is-unable-to-watch-for-file-changes-in-this-large-workspace-error-enospc

I noticed people suggesting sudo to run watch. This is a dangerous game, you are giving npm packages root access to your system. If your permissions are correct, my issue could be your fix since the limit is per user, and by running as sudo, you are running as root instead of your current user that is past the limit (running a watch heavy ide like vscode or atom on ). If for some reason you have the wrong permissions, set them properly to your user / group with chown.


I had the same problem, using sudo ng serve seemed to "solve" the problem unsatisfactorily. Using sudo is not satisfactory IMO.

I checked my INotify count versus my default limit (8192) using: lsof | grep inotify | wc -l The value returned by the above command was way less than the limit. So the INotify solution didn't seem to apply to my problem.

I also checked permissions and ownership, both seemed ok, comparable to another project that worked.

Out of frustration I restarted VS Code. Basically I closed all instances, I had two running and re-opened both following which the problem went away.

I am leaning towards a possible bug somewhere. This is something to consider before turning your system inside out. Fortunately/Unfortunately this problem hasn't occurred again, I'll dig deeper if it does.


This may help if it is the same problem I had. Trying to use ng serve and ng build --watch sometimes worked but mostly they were not watching for code changes and I thought it was something to do with ng.

Then I remembered a problem I had a while back with inotify watches

I ran this on my Ubuntu machine and it seems to have kicked in and watching code changes:

echo fs.inotify.max_user_watches=524288 | sudo tee /etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system

credit goes to Scott Smith


for window -

c:\>ng serve --open

For Linux -

$sudo ng serve --open

I had the same issue and figured out, that some files in my Angular Project were only permitted to the user root and to the corresponding group root. You can check that with ls -hal. I fixed it by setting both to the user I used the system with.

You can do that with: chown -R username:groupname *

If you want to know what exactly this command does, checkout:

https://superuser.com/questions/462141/how-to-chown-chmod-all-files-in-current-directory