'ng serve' does not work after a double install

Question

I used to have Angular CLI, but I mistakenly installed it again with

npm install -g angular-cli

And now when I run ng serve it complains:

It seems like you're using a project generated using an old version of the Angular CLI.

The latest CLI now uses webpack and includes a lot of improvements, include a simpler workflow, a faster build and smaller bundles.

To get more info, including a step-by-step guide to upgrade the CLI, follow this link: https://github.com/angular/angular-cli/wiki/Upgrading-from-Beta.10-to-Beta.12

When I try to create a new project using ng new in another directory, it complains that:

Cannot find module 'reflect-metadata'

So what is the problem?

Try `npm uninstall -g angular-cli` & `npm cache clear`. Then install the global CLI again. — Yuri, Sep 29 '16 at 15:31
I had the same issue after updating git for windows. Reinstalling CLI package helped. Don't forget restart your console after changing system PATH variable. — Arek Kostrzeba, Sep 10 '18 at 21:11
I have all the required sw installed and can verify by checking their versions, but `ng serve` still does not work and only shows a new prompt again. What do I do? This happened out of the blue, on a project that I have been working on for a while now... — CatarinaRuna, Aug 09 '21 at 08:20

score 13 · Accepted Answer · edited Sep 10 '18 at 23:05

13

The key is to have both global and local Angular-cli versions the same.

Let's say we want to fixate it to eg. 1.0.0-beta.15.

So you can try to fixate the version in npm install -g angular-cli@1.0.0-beta.15 and in your package.json fixate it to the same version: "angular-cli": "1.0.0-beta.15". Then run npm install --save-dev.

Currently Angular CLI can be found on NPM under @angular/cli instead of angular-cli. Here are links to documentation how to uninstall old and install the latest version of CLI.

edited Sep 10 '18 at 23:05

Arek Kostrzeba

551
1
7
21

answered Sep 29 '16 at 15:59

Yuri

4,254
1
29
46

Well, you have to have both - one inside your project's `node_modules` and the other globally in your *Node.js* `node_modules`. The CLI works this way. – Yuri Sep 29 '16 at 16:13
You can fixate your Angular framework version in your `package.json` to the RC5 by removing the `^` chars in front of the version string - if you want to. – Yuri Sep 29 '16 at 16:15

score 12 · Answer 2 · edited Jan 14 '22 at 18:12

12

I think you are probably using an old version of Angular CLI. You can reinstall the latest version by the following command.

npm uninstall -g angular-cli
npm cache clean
npm install -g angular-cli@latest

edited Jan 14 '22 at 18:12

Peter Mortensen

30,738
21
105
131

answered Sep 29 '16 at 15:39

YoongKang Lim

526
6
16

1

Becareful, this is a global modification, may be you just want to fix 1 project. – Luis Alfredo Serrano Díaz Dec 13 '21 at 17:55

score 10 · Answer 3 · edited Jul 19 '18 at 13:20

10

Try commands

npm start ng s

or

npm start

edited Jul 19 '18 at 13:20

Lixas

6,938
2
25
42

answered Jul 19 '18 at 12:10

indrajeet kumar

111
1
4

Check you are not serving a blank page :-) – Wilkoteq Jul 19 '18 at 14:35
This helped me troubleshoot. When I ran 'npm start', it showed that I was getting an "Access is denied" error when trying to run the ng command. Turns out my company was blocking the ng.exe. – Francisco d'Anconia Aug 05 '21 at 17:43
An explanation would be in order. E.g., what is it supposed to accomplish? Why is it necessary? What is the idea/gist? Under what circumstances should it be used? From [the Help Center](https://stackoverflow.com/help/promotion): *"...always explain why the solution you're presenting is appropriate and how it works"*. Please respond by [editing (changing) your answer](https://stackoverflow.com/posts/51422389/edit), not here in comments (***without*** "Edit:", "Update:", or similar - the answer should appear as if it was written today). – Peter Mortensen Jan 14 '22 at 18:15
I should add if you get errors when doing npm, its bc of dependencies or version differences, so you should do `npm start --force` – Olivia22 Sep 10 '22 at 02:36

score 7 · Answer 4 · edited Jan 14 '22 at 18:13

7

I was also facing this, but now it’s resolved:

Put this line in file package.json for start:

"start": "ng serve --host 0.0.0.0 --port 4201"

edited Jan 14 '22 at 18:13

Peter Mortensen

30,738
21
105
131

answered Jan 09 '17 at 05:54

nikhil kumar

81
2
4

score 5 · Answer 5 · edited Jan 14 '22 at 18:25

5

On Ubuntu, firstly do:

npm install --save-dev

Try:

sudo npm install -g @angular/cli

and then try:

ng serve

This will work 100%.

edited Jan 14 '22 at 18:25

Peter Mortensen

30,738
21
105
131

answered Mar 26 '19 at 13:07

shrikant joshi

494
4
12

global installation with "sudo" is not recommended, no – Fikret Jan 20 '21 at 08:00
What version of Ubuntu was it tested on? Please respond by [editing (changing) your answer](https://stackoverflow.com/posts/55357961/edit), not here in comments (***without*** "Edit:", "Update:", or similar - the answer should appear as if it was written today). – Peter Mortensen Jan 14 '22 at 18:26

score 2 · Answer 6 · edited Jan 14 '22 at 18:14

2

I used ng serve --open, and it worked for me.

edited Jan 14 '22 at 18:14

Peter Mortensen

30,738
21
105
131

answered Sep 16 '17 at 14:42

Stephen

9,899
16
90
137

score 2 · Answer 7 · edited Jan 14 '22 at 18:29

2

Try the below code. This works for me.

npm uninstall -g angular-cli
npm install --cache/tmp/empty-cache
ng serve

edited Jan 14 '22 at 18:29

Peter Mortensen

30,738
21
105
131

answered Jul 05 '19 at 12:14

Arita_Mong'are

21
2

score 0 · Answer 8 · answered Mar 26 '19 at 13:19

0

npm install -g @angular/cli
cd "yourProjectName"
ng serve -o

answered Mar 26 '19 at 13:19

Flash

924
3
22
44

An explanation would be in order. E.g., what is the idea/gist? Does it differ from some standard procedure? Why does it differ? From [the Help Center](https://stackoverflow.com/help/promotion): *"...always explain why the solution you're presenting is appropriate and how it works"*. Please respond by [editing (changing) your answer](https://stackoverflow.com/posts/55358185/edit), not here in comments (***without*** "Edit:", "Update:", or similar - the answer should appear as if it was written today). – Peter Mortensen Jan 14 '22 at 18:28

score 0 · Answer 9 · edited Jan 14 '22 at 18:33

0

In my case,

I was using a higher version of Angular (8+) which was not compatible with Node.js version v8.11.3. I was even getting exit status code 3. So I installed it using the Windows MSI installer and it upgraded my version of Node.js.

Courtesy - How can I update npm on Windows?.

edited Jan 14 '22 at 18:33

Peter Mortensen

30,738
21
105
131

answered Sep 29 '19 at 11:24

Sucheta Shrivastava

233
4
16

score 0 · Answer 10 · edited Jan 29 '20 at 13:35

0

I had the same issue. I was using a Linux machine and I solved it by using sudo

Just add sudo before your ng serve command. For example:

sudo ng serve --port 6161

edited Jan 29 '20 at 13:35

jtate

2,612
7
25
35

answered Jan 29 '20 at 12:26

Amol Mali

1

score 0 · Answer 11 · edited Feb 12 '20 at 22:30

0

Switch to your project and try this code:

npm i https://github.com/Qix-/node-error-ex <br/>
npm install <br/>
ng serve --open

edited Feb 12 '20 at 22:30

jla

4,191
3
27
44

answered Feb 12 '20 at 22:23

Abdeladhim Abbassi

21
5

score 0 · Answer 12 · edited Jan 14 '22 at 18:48

0

In Ubuntu, follow the following steps:

sudo npm install --save-dev

sudo npm install -g @angular/cli

ng serve

This will definitely work.

edited Jan 14 '22 at 18:48

Peter Mortensen

30,738
21
105
131

answered Feb 18 '21 at 08:20

Popat Karkhile

21
1

1

It didn't work, the app does not start the serve, just shows the prompt again – 3xCh1_23 Aug 05 '21 at 13:59
@3xCh1_23 I have the same problem; the app does not serve but just shows the prompt again. How did you solve this? – CatarinaRuna Aug 09 '21 at 07:41

score 0 · Answer 13 · answered May 12 '22 at 13:45

0

It worked for me

Open with Live Server (If Working on Index.html or app.component.html)
Type ng serve --open (In VS Code Terminal)

Changes will be visible on http://localhost:4200/

If you are using VS Code then open whole folder in VS Code.

Code runner won't work - "Code language not supported or defined"

Hope it helps you :)

answered May 12 '22 at 13:45

AtirRH

1
1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community May 13 '22 at 08:42

score 0 · Answer 14 · answered Jun 20 '22 at 19:26

0

First run command

npm i

That will download the dependencies. Once done, run

ng serve

answered Jun 20 '22 at 19:26

Sadhvik Chirunomula

763
7
7

score 0 · Answer 15 · edited Sep 04 '22 at 02:56

In my case, if you face that kind of problem:

delete node_modules folder
run: npm install
run: ng serve

watch for the missing module error report. For example: if the error says something like 'abcd.module' is missing, then find your angular project version with:

go to your project directory
run : ng --version you'll see a lot of modules, pay attention to the version. If the majority is like version 12.2.13 (for example), then:
run: npm install @angular/abcd@12.2.13 The version number is very important.

Then run: ng serve

This always works for me, in ubuntu 20.04

score 0 · Answer 16 · answered Dec 19 '22 at 12:40

npm uninstall -g angular-cli npm cache clean npm install -g angular-cli@latest

Also check system environment variables path =>

C:\Users\a\AppData\Roaming\npm\node_modules@angular\cli\bin
C:\Users\a\AppData\Roaming\npm\node_modules@angular
C:\Users\a\AppData\Roaming\npm

This fixed my issue

score -1 · Answer 17 · edited Jan 14 '22 at 18:20

-1

I tried literally everything, but this one worked for me:

Go to:

C:\Users\<profile_name>\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng

Don't forget ng at the end

Then try:

ng -v (to show the version of ng)

edited Jan 14 '22 at 18:20

Peter Mortensen

30,738
21
105
131

answered Jan 07 '19 at 06:05

Sanjay Tarani

1
2

On [Windows](https://en.wikipedia.org/wiki/Microsoft_Windows), presumably? – Peter Mortensen Jan 14 '22 at 18:20
1

Why is getting it to ***display the version information*** accomplishing anything? Are there some (positive) side effects to the state of the system by doing this? Isn't there more to this story? Please respond by [editing (changing) your answer](https://stackoverflow.com/posts/54069252/edit), not here in comments (***without*** "Edit:", "Update:", or similar - the answer should appear as if it was written today). – Peter Mortensen Jan 14 '22 at 18:22
This does nothing but output your current ng version to the console. Downvoted. – rmcsharry Jan 27 '22 at 09:36

'ng serve' does not work after a double install

17 Answers17

Linked