0% found this document useful (0 votes)
74 views6 pages

Setup Angular Project..v.1doc

This document provides instructions for setting up a new Angular project using Angular CLI version 6. It describes uninstalling any existing Angular or Node versions, installing the required versions of Node and Angular CLI, creating a new project using the Angular CLI template, and resolving any dependency issues that may occur during project setup.

Uploaded by

BHUVANA
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
74 views6 pages

Setup Angular Project..v.1doc

This document provides instructions for setting up a new Angular project using Angular CLI version 6. It describes uninstalling any existing Angular or Node versions, installing the required versions of Node and Angular CLI, creating a new project using the Angular CLI template, and resolving any dependency issues that may occur during project setup.

Uploaded by

BHUVANA
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Setup Angular Project

Pre – Requisite:

 Node : 10.8.0 ( node version need to atleast 8.9 for angular 6).
 Npm: 6.2.0

Uninstall Existing Angular:

 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 Existing Node:

 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:

 Use below command to install angular 6.x


 npm i –g @angular/cli .
 i- install, g- globally . you can find this @angular/cli in
“C:\Users\bhuvaneswari_v\AppData\Roaming\npm\node_modules “.

Known issues in installation:

 while installing you may end up with below issue ,

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.

 It happen because incompatibility of dependency versions in package.json.

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.

1. npm i --save core-js


2. npm i –save zone.js
3. npm i –save rxjs
4. npm i –save-dev @angular/compiler-cli
5. npm i –save-dev typescript
6. npm i –save-dev @angular-devkit/build-angular
7. npm i –save @angular/core
8. npm i –save @angular/common
9. npm i –save @angular/compiler
10. npm i –save @angular/platform-browser
11. npm i –save @angular/platform-browser-dynamic

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.

Update Existing projects

 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

You might also like