Angular-cli ng serve livereload not working

Question

I have created a sample project wiht Ng-cli, then i run ng serve in the source folder, the project loads correctly in the browser but livereload not working.

npm -v : 3.10.9

ng -v: angular-cli: 1.0.0-beta.19-3 node: 4.4.3 os: win32 x64

Already searched a lot information on internet, and nothing solved the issue.

score 85 · Answer 1 · edited Jun 12 '17 at 08:52

85

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

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

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

After that, I restarted my IDE, and after that, the change detection started to work.

edited Jun 12 '17 at 08:52

Pang

9,564
146
81
122

answered Jun 12 '17 at 08:33

neetesh

871
7
6

7

Although, the OP asked about win :P, the answered help me as I use Ubuntu 18 and Angular CLI 6.0.3. Thanks a lot! – sr9yar Aug 10 '18 at 08:30
for me restarting my terminal helped after these changes – PCB Apr 28 '20 at 01:58

score 34 · Answer 2 · edited Jun 13 '19 at 07:11

Increasing the amount of inotify watchers

The technical details

Listen uses inotify by default on Linux to monitor directories for changes. It's not uncommon to encounter a system limit on the number of files you can monitor. For example, Ubuntu Lucid's (64bit) inotify limit is set to 8192.

You can get your current inotify file watch limit by executing:
$ cat /proc/sys/fs/inotify/max_user_watches
When this limit is not enough to monitor all files inside a directory, the limit must be increased for Listen to work properly.

You can set a new limit temporary with:
$ sudo sysctl fs.inotify.max_user_watches=524288
$ sudo sysctl -p
If you like to make your limit permanent, use:
$ echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf
$ sudo sysctl -p
You may also need to pay attention to the values of max_queued_events and max_user_instances if Listen keeps on complaining.

Source

score 5 · Answer 3 · answered Feb 02 '17 at 10:18

5

Try ng serve -lr flag. This flag works with me. Probably the issue occurs becuase --live-reload flag is deprecated

answered Feb 02 '17 at 10:18

Alex Link

1,210
13
16

3

`ng serve --live-reload -o` angular cli 8.x.x – Vlad Jul 23 '19 at 04:45

score 4 · Answer 4 · answered Feb 05 '18 at 12:16

4

It due to the webpack.

If we running two angular application at a time. Sometimes, it may not reload application every time we need to stop and start application. For that case run one application at a time.

answered Feb 05 '18 at 12:16

uma shankar

2,522
1
10
10

score 2 · Answer 5 · answered May 09 '18 at 20:26

Is your project on a mapped network drive? I found that this caused LiveReload to fail.

Running on VS Code on Windows 7. Angular CLI: 1.7.4 Node: 8.11.1 NPM: 5.6.0 OS: win32 x64

I created a barebones Angular app with Angular CLI on my 'E:' drive, which is mapped to a folder on my network. 'ng serve' does NOT detect code changes. I copied the project to my 'C:' drive and Live Reload works as expected. So see if moving your project to a local drive solves your problem.

This is exactly the issue im facing. Thank you. – Mr. Brickowski Oct 16 '18 at 06:02 — Mr. Brickowski, Oct 16 '18 at 06:02

WasiF · Answer 6 · 2020-04-20T11:35:30.857

2

On Linux OS run your app with administrative controls using sudo

sudo ng serve

edited Apr 20 '20 at 11:35

answered Apr 04 '20 at 13:35

WasiF

26,101
16
120
128

1

a nice solution thnx – Omar Hasan Apr 20 '20 at 09:53

score 1 · Answer 7 · answered Dec 01 '17 at 11:34

Not sure of what's the issue with your version, but recently I faced the similar issue. Here is my machine environment :
Ubuntu: 16.04.3 npm -v : 5.5.1 ng -v : Angular CLI: 1.5.5 Node: 9.2.0 OS: linux x64 Angular: 5.0.4 I was using ng serve -o to serve the files locally,and this was some how causing the problem for live-reload, what fixed the problem was ng serve --open instead.Hope this helps somehow.

score 1 · Answer 8 · answered Jan 24 '19 at 20:44

Live reload server stopped working after upgrade to Angular 7.

The reason is my Node version was 10.15.0. on Windows 10 x64.

After downgrade Node to version 10.10.0 -> everything is working fine now.

You can download older Node versions from here: https://nodejs.org/en/download/releases/

Good luck.

score 0 · Answer 9 · answered Mar 27 '20 at 02:21

Just add fs.inotify.max_user_watches=524288 to this file /etc/sysctl.conf.

Or run this sudo echo “fs.inotify.max_user_watches=524288” >> /etc/sysctl.conf. Should also work if you don’t want to open the file and edit it.

Then run this sudo sysctl -p --system

Angular-cli ng serve livereload not working

9 Answers9

Increasing the amount of inotify watchers

Linked