Join Victor Mejia for an in-depth discussion in this video The ng serve command, part of Learning the Angular CLI.
- [Instructor] The Angular CLI does a really great job tailoring to developer experience. Aside from scaffolding an entire application for you, the CLI makes it really easy for you to serve your app for development. Let's go ahead and quit Visual Studio Code here. Go over to our terminal and remove the current application that we have generated. Let's generate a fresh application. ng new, the name of the application, we want routing enabled, we want styling with sass, and we want the prefix to be cm.
Now that it's ready to go, let's go ahead and change directories into the application. And to see the available options for serving your application. You can use dash dash help. ng serve and let's go ahead and use that --help flag. Lots of options to use here. Let's use the default for now. And that'll be ng serve. This command will build your app in memory and start a live development server for you at port 4200.
Once that is done, you can go to your browser and go to localhost port 42,000, and we have our sample application. There really great feature here, is that you can change any of your source files and the CLI will take care of automatically recompiling your application, and reload your browser. Let's go ahead and kill the server here using Control + C, and then open up the application in your code editor. Open up the terminal here, and let's run ng serve again.
Head over to your browser, and refresh, and we have the application again. Let's go ahead and change this title. And that is in the sample app component, and let's change that to welcome to contact manager. In our terminal, we see that the app recompiled. And our application automatically reloaded in our browser. Amazing stuff! There is another useful feature, and that is to automatically open your browser when serving your application.
Going back here to our terminal, let's kill the application using Control + C. And we can type in ng serve, and then --open. The same thing is happening as before, except now, your default browser will now be automatically open.
- Installing and using the Angular command-line interface (CLI)
- Creating new Angular projects
- Adding app assets and app libraries
- Customizing the development server
- Generating Angular application code
- Building Angular applications
- Test running options
- Ejecting from the CLI