Angular cli ng serve options

In this video we will discuss some of the common options that we can use with ng serve command.

To see the list of all options that we can use with "ng serve" command use --help option
ng serve --help

Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.

The following page also shows all the options that can be used with ng serve

The following command, builds and launches the application in your default browser.
ng serve --open

Many of our channel subscribers have sent me emails saying their application is using Internet Explorer, but they want to use Google chrome instead. So thier question is how to change my default browser. Well that's simple and it really depends on the operating system you have. For example, on a Windows 7 operatin system here are the steps to change your default browser.
1. Click on the Windows Start Button and in the "Search programs and files" text box type: Control
2. Control Panel would appear in the list. Click on it.
3. In the "Control Panel" window, click on "Default Programs"
4. In the "Default Programs" window, click on "Set your default programs"
5. In the list of programs that appear, select the "Browser" that you want to be the default browser and then click on the link that says "Set this program as default"

That's it. At this point, execute "ng serve --open" command and you will have your application launched in your specified default browser.

Instead of using the full option name --open, you can also use it's alias -o

The following table shows the common options, alias, default value and their purpose
Option Alias Default Purpose
--watch -w true Run build when files change
--live-reload -lr true Whether to reload the page on change
--open -o false Opens the url in default browser
--port -p 4200 The port on which the server is listening
--extract-css -ec Extract css from global styles onto css files instead of js ones

Text version of the video

Slides

Angular CLI Tutorial

Angular CLI Text articles & Slides

All Dot Net and SQL Server Tutorials in English

All Dot Net and SQL Server Tutorials in Arabic

[ТирионЛаннистер-цф]

thank you for the default browser info!)

[puneetkankar]

I watch all your vedio this is very helpful. Sir please make video on nodejs and mongod

[jimbo]

You're misunderstanding the question regarding ng serve --open (using a different browser). People don't want to change the their *default* browser system-wide. Instead, they want to specify which browser they want their app to open in (for debugging purposes) when they start the angular server. Example: I use Chrome for development/debugging because it has great debugging features, but I use Safari for my routine production web browsing for performance and security reasons.

[nys]

2021:
--extract-css: no need, now it's default value is true

[surekhayadav]

nice video. help me in.
for every changes i made i code it reloading entire angular application instead of that specific page.

[explorer]

hi, i am not able to get updated code upon using ng serve, localhost:port . i looked for stackover also, didnt find solution. can you plz help on this, how do i resolve this.

[AbdulHannan-kxxu]

Could you please post a video on how to use angular4 with spring-boot

[tender.branson]

Why are these commands equal and which one is more correct: ng serve -w false, ng serve --w false, ng serve -w=false, ng serve --w=false?

[sashidhar]

--extract-css option doesn't work on Angular 8. Also removed from the github

[sanmani]

I have doubt sir, Currently am working in angular4, in root moodule itself imported all components of project... Bcz of that project loading very slow at first time... Is there any solution?

[josephregallis]

In my version, --extract-css does not exist. They must have taken it out. I don't see it in the documentation.