How do I run an Angular app at the GitHub's Codespace?

Question

The node is already installed (v. 19.4) as well the npm (v. 9.2.0).

The Angular use as the default port 4200.

I set the 4200 port in the port item of the Codespace of my repository.

Then, I type on Codespace's CMD "ng serve".

I was expecting the main page of Angular showing up on Chrome.

Nevertheless, what happens is a 502 ERROR.

Please provide enough code so others can better understand or reproduce the problem. — Community, Jan 25 '23 at 13:42

score 5 · Answer 1 · answered Jan 25 '23 at 14:37

5

I've been able to get Angular running in Codespaces by changing the Node version to 16.13. NVM comes pre-installed, so all you need is:

nvm install 16.13

npm install -g @angular/cli

ng serve

answered Jan 25 '23 at 14:37

Meqwz

1,319
8
14

1

Thanks, i was able to run the angular app by changing the node version using NVM. – Eskinder Jan 30 '23 at 10:18
I am wondering why it doesn't work with the default nvm. – Shaounak Nasikkar Mar 02 '23 at 00:26

score 2 · Answer 2 · answered Apr 26 '23 at 13:18

Here is what I have working on my code space: Under the "scripts" section in package.json add the following script :

"start-on-codespaces": "ng serve --project=your-project-name --host=0.0.0.0 --disable-host-check",

When I run this script on the console, I then click on the localhost Url that is displayed in the console output.

score 1 · Answer 3 · answered Jun 14 '23 at 17:56

ng serve --host=0.0.0.0 is enough to run the project. You also need to forward port 4200 and make it public.

To reach the Jasmine test page you need to enable port 9876, however, the Jasmine instance fails to find the Angular serve instance. I'm looking for a Jasmine configuration or command parameter that would fix this.

Rahul kumar · Answer 4 · 2023-06-15T22:01:35.973

1

It worked for me:

nvm install 16.13
npm install -g @angular/cli
ng serve

edited Jun 15 '23 at 22:01

answered Jun 15 '23 at 21:59

Rahul kumar

11
2

Basil · Answer 5 · 2023-07-02T14:01:45.887

1

What has worked for me, summer 2023, is to use this:

npm run start -- --host=0.0.0.0 --public-host=${CODESPACE_NAME}-4200.preview.app.github.dev

I don't know why ng serve with the same options doesn't work but npm run does. I'm still learning angular and node.

edited Jul 02 '23 at 14:01

answered Jul 02 '23 at 13:54

Basil

123
8

score 0 · Answer 6 · answered Mar 02 '23 at 01:18

As per angular documentation -

Angular requires an active LTS or maintenance LTS version of Node.js.

So accordingly, I have tested with all the LTS versions, but it only worked for v16.19.1 for me.

Is there a compatibility list for Angular / Angular-CLI and Node.js?

score 0 · Answer 7 · edited May 12 '23 at 15:59

0

The Angular CLI requires a minimum NodeJS version of either v14.20, v16.14 or v18.10.

nvm install 14.20 | 16.14 | 18.10

nvm install 18.10

npm install -g @angular/cli

ng serve

edited May 12 '23 at 15:59

zforgo

2,508
2
14
22

answered May 11 '23 at 17:09

rodolfo

1
1

score 0 · Answer 8 · answered Aug 16 '23 at 15:50

I invested several hours this week resolving the ng serve issue within GitHub codespaces using the latest LTS version of Node (18.17.0). Through numerous trials, I've gathered a few noteworthy observations:

The command --host=0.0.0.0 --disable-host-check proves to be indispensable.
Despite my repeated attempts, the default port 4200 failed to function effectively.
Simply altering the port did not yield a resolution.

Ultimately, I managed to devise a successful solution by combining --host=0.0.0.0 --disable-host-check with a port change, which produced the desired outcome:

ng serve --host=0.0.0.0 --disable-host-check --port=3000

Throughout my endeavors, I discovered that any port, except for 4200, performed as expected.

How do I run an Angular app at the GitHub's Codespace?

8 Answers8