#ngUpdate What’s New with Angular 12

3 min readMay 15, 2021

Hola! ngDev, there is #ngUpdate Party with new launch of Angular 12. Angular Team Release Public Version of 12.0.0 officially here and it has some great updates for Angular developers everywhere. 🎉🎉

TL;DR 🙌

👉 Nullish Coalescing
👉 Inline Sass
👉 IE & View Engine Deprecation
👉 Removing Protractor
👉 Updates in Tooling

How to Update to v12

Use update.angular.io to check how it will affect your currently developed application or if you planning to upgrade the version.

Update to v12: Run in your Current Project

ng update @angular/cli @angular/core

In order to update your global angular: use

npm i -g @angular/cli

Nullish Coalescing

It Provides sweet & clean code for conditionals and type checking. We can use nullish coalescing in angular components

Inline Sass

With v12, there is core support of Inline sass in component itself, now you can write you own sass in the style array of Component.

Goodbye IE & View Engine

With v12, Angular Team Deprecated the Support of IE 11 and will be removed completely in Angular 13.
There is also big change of Deprecation of view Engine. In order to Move in to Ivy Environment, Angular Team decided to deprecate the view Engine and Default Enable Ivy as there is less number of packages are using view Engine. Read More Here

Removing Protractor

As v12 Opted not to include Protractor in new Projects and, instead, provide options with popular 3rd party solutions in the Angular CLI. Alterative to that Cypress, WebdriverIO, and TestCafe.

New Updates in Tooling

Ng Build Default to Prod: As Many Developers has Problem of ng build, for Production they use to add --prod to build the application for prod. But with new v12 there is default build to Prod in order to avoid mistakes.
Strict Mode By Default: With v12 there is strict mode for type and template checking with Angular, which helps developers to write clean and secure code. It means aot is enabled by default.
Ivy-based Compilation to Default: Ivy Based compilation is enabled by default in v12 and provides better code compilation, area reporting hints and navigation inside angular application.
Webpack 5: In v12, there is Production ready support of webpack 5.

Adding Support of Tailwind CSS

Angular Team added support for Tailwind CSS in the v11.2 release, To get started using it in projects: install the tailwindcss package from npm and then initialize Tailwind to create the tailwind.config.js in your project. Now, developers can start using Tailwind in Angular.