Professional Documents
Culture Documents
Setup Angular Project..v.1doc
Setup Angular Project..v.1doc
Pre – Requisite:
Node : 10.8.0 ( node version need to atleast 8.9 for angular 6).
Npm: 6.2.0
We are going to install fixed angular version 6.1.3. so if lower version is exist we
have to uninstall them using below command.
npm uninstall –g angular-cli (or) npm uninstall –g @angular/cli
Angular-cli is used for version 2 and @angular/cli is used for version 4 and 6.
If your node version is below 8.x you have to uninstall node also.
Uninstall all the packages those are installed via npm globally eg : npm uninstall –g
typescript. Because it may cause cache issue after reinstallation of new node.js.
If you are sure about those packages goto
“C:\Users\bhuvaneswari_v\AppData\Roaming\npm\node_modules “ and check it.
Go to your Control Panel\Programs\Programs and Features and find node.js and
uninstall it.
Now go to “C:\Users\user_name\AppData\Roaming” find npm and npm-cache and
delete permanently (SHIFT + DELETE ).
You are now successfully uninstalled node.js , install new node.js with 10.8.0 version
Angular Installation:
Page | 1
To fix this issue you have to install typescript globally using below command,
npm i –g typescript
After typescript installation , continue with angular installation and check angular
version using ng –v. This will show your current version of angular/cli like below.
Page | 2
Setup New Project:
You can either create a angular app from scratch or angular project template from cli.
It is recommended to use template project because it reduce lot of time for installing
packages those are necessary . also it has e2e and unit test files. Install new project
template using below command.
ng new projectname ( projectname without space).
It will create template for your project and install node modules. After successful
installation your project structure like below.
Page | 3
Some times node modules installation may fails, and throw error like below.
Page | 4
Dependency and dev dependency version in above pictures are conflict with each
others.
In this kind of situation we have to create our own package.json manually.
Setup Package.Json
Delete dependencies and dev dependencies in your package.json and install below
commands in order. Here --save is used to update your dependency and --save-dev for
dev dependency.
Page | 5
12. npm i –save @angular/forms
13. npm i –save @angular/router
now you have created basic package,json without e2e (protractor, jasmine) , unit test (
karma ).
now you can build and start the project using ng build, ng serve.
Angular cli 6.x allows us to update our project to latest version of angular using ng
update command. For this your project must be atleast version 4 .
Use this checklist for more simplicity, https://update.angular.io/.
Go to your proj folder enter below command
1. ng update “proj_name”
2. ng update @angular/core
3. ng update @angular/material ( optional).
4. npm i rxjs-compat.
Page | 6