Setting up Angular Development environment

Setting up Angular Version 6,7,8 Development environment

Step 1: Install Node and NPM using the link below. 
https://nodejs.org/en/download/

Step 2: Install Angular CLI.

Execute the following command and it will install the latest version.

npm install -g @angular/cli

If you already have Angular CLI installed, and you want to upgrade to the latest version, then execute the following command

npm install -g @angular/cli@latest

Step 3: Download and install Visual Studio Code
https://code.visualstudio.com/download

Step 4: Install bootstrap and jQuery. jQuery is required as bootstrap relies on jQuery for some of its features. If you plan on using those features then only you need to install jQuery or else not required.

npm install bootstrap –save

npm install jquery –save

Step 5: Refer bootstrap and jQuery files in the project. In angular.json add bootstrap reference in styles array as below.

"styles": [

  "src/styles.css",

  "node_modules/bootstrap/dist/css/bootstrap.min.css"

]

If your bootstrap uses jQuery features then you need to refer jQuery reference as well in scripts array in angular.json file.

"scripts": [

  "node_modules/jquery/dist/jquery.min.js",

  "node_modules/bootstrap/dist/js/bootstrap.min.js"

]

I am using angular version 8 for this. Before starting to create a new project check the versions of installed software’s required for angular development.

Type ng v in the command prompt. It will show Node version, angular CLI version and other required library versions those are required for angular development.

To know the typescript version used in your project, navigate to project folder in command prompt and type the below command. It will show you details.

Alternative way to know typescript version:

Run tsc with the -v flag if installed locally

node_modules\.bin\tsc -v

If installed globally:

tsc -v

Throwing error as typescript is not installed globally.

Another way is to check the package.json inside the project folder