How To Upgrade To Angular 9? - Appventurez
Blog / Angular / How To Upgrade To Angular 9?

How To Upgrade To Angular 9?

Anand Prakash By Anand Prakash | February 13, 2020
angular version 9 upgrade

Angular 9 is launched and has come up as a treat for the developers. The latest upgrade includes some exciting features of Angular in terms of ivy that was released on 7th February 2020.

The Angular 9 all-new features are more than enough to keep the audience hooked and work efficiently in the Angular ecosystem. The shaking features are able to save size in terms of large bundles and there are small improvements for developers. 

Developers are all set to update the CLI version to the latest Angular 9 that is a lot easier. The ng update command has made it easy for developers to update to dependencies and specific versions. 

Read more: Introduction to Angular

What Is ng Update Command?

This command is used to update the application along with its dependencies in Angular CLI. With the help of this command, it is easy to update different package.json files. To do so, the –all option is used that takes false or true or even –package option for specific Angular version

How To Update Angular To Version 9?

In order to update Angular to version, the @angualr/core and @angular/cli must be updated to the latest version. 

ng update @angular/[email protected] @angular/[email protected] –force

Then start the code to get Angular 9 update easily.

ng update @angular/cli @angular/core –next

The pre-release version is new as compared to the Angular CLI version. Hence, install a temporary version to ensure that updates perform in a better way. 

Use yarn to install the package, use ‘yarn’ for the package manager. In the end, collect installed dependencies to finalize the update. 

Once done, start the local machine and open the app. Make sure to keep an eye on any error that might pop up. Start with pull request and production deploy to get started with the build process. 

Or you can follow the GitHub approach for v7 to v9 as mentioned below:

1. Use GitHub To Clone The Project

In the GitHub repository, clone Angular 7 and run the command

$ git clone https://github.com/techiediaries/angular-portfolio

Once done, navigate it to the folder and use:

$ cd angular-portfolio$ npm install

2. Identify The Angular Version Used In The Projects

Then follow the command

$ ng version

An output will pop up showing the details of its packages and versions including CLI v7.1.4 and local versions installed in the system.

3. Follow The Upgrade Process

Follow Up the upgrade process with the help of the Angular Update Guide to specifying the update to v9. Tap on the Show me how to update and move to v9 from v7.

Select the project, in case of a warning, move to v8 instead of 9 to avoid multiple version jump. Start with the upgrade of the project.

4. Update It To v8

It is best to make sure that Node 10 is used to improve type checking. Use the command-line

$ ng update

This will help in analyzing package.json and a list of packages will pop up as the outcome.

Start with the core framework update to v8.2.14 or v8.3.19 with the help of

$ ng update @angular/cli @angular/core

You will be updated successfully to Angular 9 from CLI. after this, use the command

$ ng –version

This will send out the outcome of different packages that are installed successfully in the system.However, if you are using any low version then make sure to go one step at a time and update any version to Angular version 9.

5. Follow It With Pre-Release Of Angular 9 Version

After this is done, update to Angular 9 with the help of the command line:

Using package manager: ‘npm’Collecting installed dependencies…Found 32 dependencies.We analyzed your package.json and everything seems to be in order. Good work!

This is due to the pre-release version of 9 and to get it to use the command:

$ ng update –next

As a rest, you will get the version of @angular/cli and @angular/core. Follow it up with the command

$ ng update @angular/cli @angular/core –next

It is possible to get an error after this, due to unclean repository so make sure to stash it up and use flag to proceed forward.

$ ng update @angular/cli @angular/core –next –allow-dirty

This will update the app to Angular 9 successfully. 

6. Serve The App

Now, since the app is upgraded to the latest version make sure to check its working with:

$ ng serve

Make sure to follow the guidelines to ensure that they work in a smooth manner. If you are not careful then it is possible that the update will not work properly. 

Anand Prakash
Anand Prakash

Co-Founder and AVP Technology at Appventurez Mobitech. A tech enthusiast who has broad expertise in delivering end to end software solutions. He is an expert technocrat ho has in-depth knowledge and is highly experienced in delivering solutions for Android, Xamarin, Ethereum Smart Contracts, ASP.net.

⚡️ by Appventurez

Leave a Reply

Please rate*

Your email address will not be published. Required fields are marked *

Hey there! This is Anand, author of this blog. Leave your email address and we'll keep you posted on what we're up to.

This will subscribe you to Appventurez once-a-month newsletter. You can unsubscribe anytime. And we promise not to pester you or share your data :)

Hey there, wondering where this article came from? It was produced by some people at Appventurez, a Mobile & Web App Development Company. We are here for solutioning of your technological needs.

Our Latest Blog

how to develop a bitcoin wallet app | Appventurez
How To Develop A Bitcoin Wallet App?

As a kid, I was fascinated with science fiction movies and used to wonder a lot...

Read more
android app development tools | Appventurez
Top 5 Tools For Android App Development

More than 2.9 million apps are available on Android’s Play Store - according ...

Read more
tips to increase mobile app response rate | Appventurez
14 Tips To Increase The Mobile App Response Rate

Smartphones become invincible when they are graced with mobile applications. Th...

Read more

Our Global Presence

Appventurez Map
Mobile App Agency In USA USA
Usa Flag

USA

5440-F Thornwood Drive San Jose, CA 95123

+1-512-823-1002
Mobile App Agency In Australia Australia
Australia Flag

Australia

5 Taunton Place Craigieburn VIC Australia

+1 512-823-1002
Mobile App Agency In Germany Germany
Germany Flag

Germany

Frauengartenstr. 2, Hechingen, Baden-Wuerttemberg, Germany 72379

+49 7471 9699793
Mobile App Agency In Qatar Qatar
Qatar Flag

Qatar

Office #216 Regus Tower Bank Street, Doha Qatar

+974-33497259
Mobile App Agency In India India
India Flag

India (HQ)

Logix Infotech Park, 1st Floor, Plot No.- D-5, Sector 59, Noida, Uttar Pradesh 201301

+91 120 41 577 46
Mobile App Agency In Dubai Dubai
Dubai Flag

Dubai

Rimal 5 Jumeirah Beach Residence 2 Dubai

+1 512 823 1002
Mobile App Agency In South Africa South Africa
South Africa Flag

South Africa

3 monterrey Complex, 63 Montrose Avenue, Northgate, Johannesburg, 2191

+27 737 810 945
Mobile App Agency In United Kingdom United Kingdom
United Kingdom Flag

United Kingdom

7 Hanover House, Chapel Street, Bradford BD1 5DQ, United Kingdom

+1 512 823 1002
Mobile App Agency In Mexico Mexico
Mexico Flag

Mexico

Calle Ambar 2711, Av Victoria, 45089, Zapopan, Jalisco, Mexico

+521 332 393 9998
India Flag

India (HQ)

Logix Infotech Park, 1st Floor, Plot No.- D-5, Sector 59, Noida, Uttar Pradesh 201301

+91 120 41 577 46
Australia Flag

Australia

5 Taunton Place Craigieburn VIC Australia

+1 512-823-1002
Qatar Flag

Qatar

Office #216,Regus Tower, Bank Street, Doha Qatar

+974-33497259
Germany Flag

Germany

Frauengartenstr. 2, Hechingen, Baden-Wuerttemberg, Germany 72379

+49 7471 9699793
USA Flag

USA

5440-F Thornwood Drive San Jose, CA 95123

+1-512-823-1002
Dubai Flag

Dubai

Rimal 5 Jumeirah Beach Residence 2 Dubai

+1 512 823 1002
South Africa Flag

South Africa

3 monterrey Complex, 63 Montrose Avenue, Northgate, Johannesburg, 2191

+27 737 810 945
United Kingdom Flag

United Kingdom

7 Hanover House, Chapel Street, Bradford BD1 5DQ, United Kingdom

+1 512 823 1002
Mexico Flag

Mexico

Calle Ambar 2711, Av Victoria, 45089, Zapopan, Jalisco, Mexico

+521 332 393 9998