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