© Spirit Boom Cat/Shutterstock.com
Neuerungen in Angular 10

Ruhe vor dem Sturm?


Als Wartungsrelease bringt Angular 10 vor allem Bugfixes und Abrundungen am Tooling: Beispielsweise nutzt ein neuer Strict Mode strengere Compilerprüfungen und das CLI warnt nun beim Einsatz schlecht optimierbarer CommonJS Bundles.

Angular 9 brachte den langersehnten Ivy-Compiler, an dem das Team rund zwei Jahre lang gearbeitet hat. Die Arbeiten an Version 10 wurden nun genutzt, um aufräumen. Es handelt sich dabei also primär um einen Wartungsrelease mit zahlreichen Bugfixes und internen Verbesserungen. Trotzdem hat Angular 10 auch ein paar ganz nette Abrundungen zu bieten. Um diese dreht sich der vorliegende Artikel.

Wer eine bestehende Anwendung auf Angular 10 heben möchte, muss dazu lediglich ng update ausführen:

ng update @angular/cli @angular/core

Strict Mode

Im Lauf der Zeit haben sowohl TypeScript als auch der Angular-Compiler verschiedene Optionen zur strikteren Prüfung des Quellcodes erhalten. All diese Optionen haben ein Ziel: das frühzeitige Erkennen von Programmierfehlern. Allerdings können zusätzliche Prüfungen bestehenden Quellcode brechen. Deswegen sind sie auch nicht standardmäßig aktiviert, sondern müssen über Einstellungen in der TypeScript-Konfiguration eingeschaltet werden.

Kleine Budgets bei --strict

Die Option --strict verkleinert auch die standardmäßig in der angular.json eingerichteten Performance Budgets auf ein Viertel. So gibt ng build beispielsweise bereits eine Warnung aus, wenn das initiale Bundle 500 KB überschreitet und ab 1 MB einen Fehler. Ohne den Schalter --strict liegen diese Grenzen bei 2 MB und 4 MB. Da es sich hierbei lediglich um Einträge in der angular.json handelt, lassen sich diese Grenzen bei Bedarf auch verändern.

Um das Aktivieren dieser Prüfungen bei neuen Projekten zu automatisieren, weist ng new nun einen neuen Schalter --strict auf (Kasten: „Kleine Budgets bei --strict“). Er veranlasst das CLI, die in Listing 1 gezeigten Einstellungen zu generieren.

Listing 1

"compilerOptions": { [...], "forceConsistentCasingInFileNames": true "strict": true, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true, [...] }, "angularCompilerOptions": { "strictInjectionParameters": true, "strictTemplates": true }

Tabelle 1 bietet einen Überblick über diese Einstellungen. Hinter der Eigenschaft strict verbergen sich weitere Optionen, die TypeScript aktiviert. Ein Überblick hierzu findet sich in Tabelle 2.

Einstellung

Beschreibung

forceConsistentCasingInFileNames

Verweise auf TypeScript-Dateien müssen immer g...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang