What's new in Angular v12 | Everything you need to know about Angular 12

 

Angular is Open source TypeScript Base Framework that is used to build Single Page Applications. Angular keep on adding new features day by day now it has come with some amazing feature that are added in Angular v12 or we can say in the Angular latest version. Angular released new version that is v12 on 13 May 2021

Here are the list of newly added features to Angular 12:

1.Angular latest version now defaults to production mode while running ng build. This can help extra steps and may help to prevent developer build in production.

2.Strict mode is now by default enabled in v12 angular latest version that can help you catch bugs ahead of time and strict mode can help you reduce bundle size budget.

3.The Language Service moved opt-in to defaults in angular v12 that helps you by providing  amazing features such as errors, code completions, hints and navigation in angular templates.

4.In Angular 12 now releassing WebPack 5 supports in production ready version that was added experimental supports in v11.

5.TypeScript  supported version 4.2 is now include

  • Smarter Type Alias Preservation
  • Leading/Middle Rest Elements in Tuple Types
  • Stricter Checks For The in Operator
  • --noPropertyAccessFromIndexSignature
  • abstract Construct Signatures
  • The --explainFiles Flag
  • Improved Uncalled Function Checks in Logical Expressions
  • Destructured Variables Can Be Explicitly Marked as Unused
  • Relaxed Rules Between Optional Properties and String Index Signatures
  • Declare Missing Helper Function
  • Breaking Changes

6. Angular v12 now supports inline Sass in styles attribute of @component.

To enable this feature consider including "inlineStyleLanguage": "scss” to angular.json. 

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `<h1>Hello world from {{title}}</h1>`
  styles: [
  `
  $color-red: red; // declaring a Sass variable
  h1 {
    color: $color-red; // using the Sass variable here
  }
  `
  ]
})
export class AppComponent {
  title = 'angular';
}

7.Tailwind CSS which is a NPM package now supports in Angular v12. In v11 tailwind.config.js considered creating to initialize in angular now supports in default.

8. node-sass package is now replaced by sass NPM package , node-sass is not maintained and will not be a feature to SASS language.

9.Angular v12 now updated new SASS API by updating the angular application with ng-update

10.Nullish Coalescing : There is no need to define Nullish Coalescing separately for null and undefined value. Simply use this 

{{name !== null && name !== undefined ? name: someExpression() }}

becomes: 

{{ name ?? someExpression() }}

11. VIew Engline is deprecated and will be removed in future releases.

12. View Engine will still work with IVY Application in angular.

13.Angular v12 now Supports APP_INITIALIZER  to work with observables

Summary 

In this section, Angular is a huge platform as it is a complete solution to any kind of web development problem today, With new this releases in Angular 12 , we can make more use of  SASS files as it is default in Angular now. Along with this we have gone through all of Angular new features in version 12.Let me know which one who liked the most by commenting!

Related articles

1 comment:

  1. I really enjoyed reading your blog. It was very well written and easy to understand. Unlike other blogs that I have read which are actually not very good. Thank you so much!
    Hire Dedicated Angular Developer

    ReplyDelete

Powered by Blogger.