Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to update / upgrade from Angular 4 to Angular 5+

I need to update my project from Angular 4 to Angular 5+ ,

I need to change all following dependencies to Angular 5+.

I also updated Angular CLI to 1.5.0.

I tried to create new project but it seems to create only Angular 4 project.

ng new NG5_Project

"dependencies": {
  "@angular/animations": "^4.2.4",
  "@angular/common": "^4.2.4",
  "@angular/compiler": "^4.2.4",
  "@angular/core": "^4.2.4",
  "@angular/forms": "^4.2.4",
  "@angular/http": "^4.2.4",
  "@angular/platform-browser": "^4.2.4",
  "@angular/platform-browser-dynamic": "^4.2.4",
  "@angular/router": "^4.2.4",
  "core-js": "^2.4.1",
  "rxjs": "^5.4.2",
  "zone.js": "^0.8.14"
}

What am I doing wrong.

CLI Config :

CLI Config

like image 629
Sangwin Gawande Avatar asked Nov 02 '17 07:11

Sangwin Gawande


People also ask

How do I upgrade Angularjs 4 to 11?

You can run ng add @angular/localize to include required packages. Finally, run ng update @angular/core @angular/cli command to update to Angular 11. This will migrate your project to latest Angular release. After the update to Angular 11 is done your project will be using Typescript 4.


4 Answers

This specific problem was fixed with Node version update.

I had to update Node version,

sudo apt-get install nodejs

npm uninstall -g @angular/cli

npm cache clean

npm install -g @angular/cli@latest

ng new ProjectName

node --version ==> 8.9.0

ng --version ==> 1.5.0

"dependencies": {
    "@angular/animations": "^5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "rxjs": "^5.5.2",
    "zone.js": "^0.8.14"
}

UPDATE :

There is also official Angular update guide available now : https://update.angular.io

You can update Angular versions from minimum of v2.0 to latest version (v15.0 currently) with proper steps

update Angular versions

like image 96
Sangwin Gawande Avatar answered Oct 19 '22 16:10

Sangwin Gawande


Here's the correct answer, and it's super simple.

Follow the official Angular upgrade guide.

You'll fill out a short form selecting which version of Angular you are on and which version you want to upgrade to. It then shows you the list of necessary steps to take to perform the upgrade. You should follow this guide for all upgrades. (Please upvote before navigating away) :)

https://update.angular.io/

enter image description here

like image 11
Francisco d'Anconia Avatar answered Oct 19 '22 16:10

Francisco d'Anconia


Check Angular blog out

https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced

In the article, an update guide is mentioned.

You can find it here: https://angular-update-guide.firebaseapp.com/

Also, you can update your angular-CLI to 1.5.0 which will create angular v5 project. You can compare the differences with yours.

like image 7
Bunyamin Coskuner Avatar answered Oct 19 '22 14:10

Bunyamin Coskuner


If you want to simply upgrade your angular4 project to angular 5 do the following.

  1. Go to your project directory.
  2. Open a command prompt and run the following commands
  3. npm install -g npm-check-updates
  4. ncu -u

This worked for me.

http://www.talkingdotnet.com/upgrade-angular-4-app-angular-5-visual-studio-2017/

like image 7
Jerin Kurian Avatar answered Oct 19 '22 15:10

Jerin Kurian