Installing the Angular CLI ( 3 of 4 )

< Intro to Visual Studio Code

Overview

Time: 5min

The Angular CLI makes it easy to create an application that already works, right out of the box. It already follows our best practices! It allows you to:

Generate components, routes, services and pipes with a simple command. The CLI will also create simple test shells for all of these.
Easily put your application in production
Make your code really shine. Run your unit tests or your end-to-end tests with the breeze of a command. Execute the official Angular2 linter and run clang format.

Learn more at Angular CLI Website

Check Node.js & npm versions

Time: 5min

Both the CLI and generated project have dependencies that require NodeJS, together with NPM (use LTS versions).

Check your versions of Node.js and NPM

Check you have the right versions:

 node -v
 npm -v

Install Node.js LTS Version https://nodejs.org/en

If you do not have node installed, install it from https://nodejs.org/en

Upgrading Node and NPM

If you do not have the right version of node or npm, it is best to uninstall then and reinstall them and your global npm packages.

Using the command below you can check which global npm packages you have installed so that you can reinstall them afterward.

 npm -g ls --depth=0

Install the CLI

Time: 10min

Important Note: If you already have a previous version of the Angular CLI installed, you must uninstall it. Jump to the next step 'Updating the CLI'.

Use npm to install the CLI with the below command

npm install -g @angular/cli

As a refresher, the -g flag installs this package globally, which means we can run it from anywhere on the machine.

Once installed you should be able to create a new Angular project

ng new hello-world

Once created you can change directory into the project and run it with ng serve.

cd hello-world
ng serve

You should now be able to open a browser at http://localhost:4200 and view your website.

Updating the CLI

Time: 10min

If you have installed the CLI before it is best to check you have the latest version. If you do not follow the below steps to reinstall it:

ng v
npm uninstall -g angular-cli @angular/cli
npm cache clean
npm install -g @angular/cli

Troubleshooting

Time: 5min

If you get node-gyp errors follow instructions here
https://github.com/nodejs/node-gyp

If you get permission errors follow instructions here
https://docs.npmjs.com/getting-started/fixing-npm-permissions

Possibly needing to:

add %AppData%\npm to the beginning of the PATH environment variable
run set-ExecutionPolicy RemoteSigned -Scope CurrentUser
set git user to avoid this error 'Author Identity Unknown' (git config)