06 Updating Angular

This step of the tutorial will take a little detour from component creation and @prosoft/components usage and will instead show you how you can update your versions of Angular and Angular Material.

This step will perform the update from version 10.2.X to 11.X of both Angular and Angular Material. For other constellations or future updates you can use the Angular Update Guide for guidance.

Use the command ng update @angular/core@11 @angular/cli@11 @angular/material@11 to start the update. If you want to update to the most current version regardless of this tutorial, just leave out the version numbers and the preceding @. This command will update the provided packages and their dependencies in the given order and will run their respective update schematics if they exist (e.g. "Remove deprecated options from 'angular.json' that are no longer present in v11."). The example schematic should remove "extractCss": true, from your angular.json. The schematics should not touch anything else if you use the provided solutions as nothing we used up until now required modification for version 11 to work.

When you update Angular you can use the opportunity to check for updates of your other packages too. Be careful if you update Angular while some of your other packages still do not support the target version. You can use --force to go through with the update if you are sure the other packages are compatible even if they are not declared to be.

After the update the changes should look similar to the ones in this commit. Version numbers might slightly differ.

This concludes the update from version 10.2.X to 11.X. This tutorial continues with Step 7.