Published:

Angular CLI - Auto launch browser on localhost after app start with ng serve

This is a super quick tutorial to show how to automatically open the browser on localhost after starting an app with Angular CLI.

Pass the --open option to ng serve

Run the following Angular CLI command to start the application and automatically launch it in a new browser window.

ng serve --open


Ng serve command output

Here's the output from the command when I ran it on an Angular 14 project, it automatically opened in Chrome (my default browser) after compiling.

> ng serve --open
✔ Browser application bundle generation complete.

Initial Chunk Files   | Names         |  Raw Size
vendor.js             | vendor        |   2.39 MB |
polyfills.js          | polyfills     | 318.10 kB |
styles.css, styles.js | styles        | 210.36 kB |
main.js               | main          |  38.35 kB |
runtime.js            | runtime       |   6.56 kB |

                      | Initial Total |   2.95 MB

Build at: 2022-11-23T02:38:22.490Z - Hash: 98d10ea69f118837 - Time: 10496ms

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **


√ Compiled successfully.


Install or update Angular CLI

If you need to install or update Angular CLI, execute the following npm command.

npm install -g @angular/cli

 


Subscribe or Follow Me For Updates

Subscribe to my YouTube channel or follow me on Twitter, Facebook or GitHub to be notified when I post new content.

Other than coding...

I'm currently attempting to travel around Australia by motorcycle with my wife Tina on a pair of Royal Enfield Himalayans. You can follow our adventures on YouTube, Instagram and Facebook.


Need Some Angular Help?

Search fiverr to find help quickly from experienced Angular developers.



Supported by