Shakil Khan
Jul 22 · 4 min read
Angular 8 Upgrade

This will be the third article in the Angular 7 series that I started a few months ago. As Angular 8 is already out, in this part I will start with upgrading our project to the latest stable version.


Why Upgrade to Angular 8

It is very important for us to understand why we should keep upgrading to the latest version. Not just for Angular, but also for other dependency packages we use in our project.

Any open source community, especially Angular’s team, is quick and active on resolving issues and offering new features and functionalities. This is how technologies are evolving rapidly.

I can guaranty, if any of your major dependencies are behind on two or more major releases, you are at risk of losing active community support. One day you will find yourself in a state where you have to give up your codebase and rewrite the whole thing.

I personally don’t like the concept of giving up on a project and starting a new one, just to avoid some problems that we created over time.


Steps to Upgrade

1. Create a new branch

I will use same Git repo as in the Angular 7 series to add a new branch part-3/upgrade-angular-8, using this command: git checkout -b part-3/upgrade-angular-8.

2. Identify how to upgrade

Upgrading to a new version is simpler than it used to be. This is due to the Angular team for making upgrading steps easy and simple.

To identify which commands you need to run to update your project, visit the Angular Update Guide.

Select your current (which is 7.*.* for us) and expected version ( 8.*.*), then click on the “Show me how to update!” button.

It will show you a list of the things you need to do.

Angular Update Guide
Angular Update Guide | 7.0 -> 8.0 for Basic Apps

3. Run update command

From the list of items above, there’s only one command I need to run: ng update @angular/cli @angular/core, to update our project to Angular 8.

Once I run that command, I got some warnings as my global and local CLI versions did not match. In your case, you might not get any errors.

List of warnings and incompatibilities

To resolve this warning, I need to run an update command with the — force flag.

As you can see here:

Update command with `- - force` flag

The Angular CLI has added new prompts to get your permission to share anonymous usage data. In my case, I replied no.

Awesome, our project has successfully upgraded to Angular 8.

4. Compile and run

As we’re done with upgrading, let’s compile our home app to validate if everything is working properly or not: npm run home:client.

run home app

Yes! We now have Angular 8.1.2.

Angular 8 (home app)

Resources

Source code for this piece:

To learn more about the Angular update command, visit angular.io.


Better Programming

Advice for programmers.

Shakil Khan

Written by

Software Engineer, Kaplan Test Prep

Better Programming

Advice for programmers.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade