Installing the Angular CLI
In the world of frameworks, regardless of the language, we often find tools that can help us with day-to-day software development, especially when there are repetitive tasks.
The Angular CLI is a command-line interface for creating, developing, and maintaining Angular applications in a very productive way. It is an open source tool developed by the Angular team itself.
With the use of the Angular CLI, we are able to create the entire base structure of an Angular application, as well as the modules, components, directives, services, and more. It has its own server for development and helps us with the application build.
Now, it's time to install it:
- Open your Terminal and type the following command:
npm install -g @angular/cli@latest
After the installation, you will see the following output in your Terminal:
+ @angular/cli@1.7.3 added 314 packages, removed 203 packages, updated 170 packages and moved 7 packages in 123.346s
The number of packages removed and updated and the Angular CLI version may be different. Don't worry.
- You can remove your old version of the Angular CLI and install the latest version with the following commands:
npm uninstall -g angular-cli npm cache verify npm install -g @angular/cli@latest
Note that the preceding command will install the Angular CLI globally on your environment/machine. Frequently, when we develop using the Angular framework and the Angular CLI, we see warning messages about the differences between versions. This means that, even if you have installed the latest version of the Angular CLI in your environment, the Angular CLI will check the version used in the current project and compare it to the version installed on your machine, and will use the current project version.
This is very useful when you work on third-party projects and need to keep dependencies consistency between the globally Angular CLI installed on your machine and the local project version installed on node_modules project folder.
- Inside of your current Angular project, type the following commands:
rm -rf node_modules npm uninstall --save-dev angular-cli npm install --save-dev @angular/cli@latest npm install
Like the other commands that we are using in our book, the Angular CLI has a command called ng help. With it, we can access a vast list of options.
One of these commands is particularly useful when we are developing applications with Angular and need to consult something in the official documentation, without leaving the Terminal.
- Go back to your Terminal and type the following command:
ng doc HttpClient
The preceding command will open your default browser right at the HttpClient documentation API, using https://angular.io/api?query=HttpClient. So, you can combine the ng doc command with anything from the API that you want to search.
We now have everything we need to start developing web applications using the Angular CLI, but, before we get deeper into building a sample application, we're going to update our toolkit with some very useful tools.