What are new features in Angular version 11?

Angular version 11, the latest Angular version has been released. I know, I am little late in writing blog on Angular 11, but It’s never too late to start something new.

Welcome to Angular 11

Like other software updates, Angular is updating its version regularly. With every updates it provides something new which is helpful to developers. As you know, Angular V4, V5, V6, V7 and V8 are no longer under support.

Angular 9 was released in Feb 2020, Angular 10 was released on Jun 2020 and the Angular 11 released on Nov 2020 is the latest version till this blog was published.

What’s new in Angular version 11?

We all are curious to know what are the new things introduced in Angular 11. Let’s explore them one by one.

Angular 11 release date

Angular 11 was released on Nov 11, 2020 and as per Angular official website the Long term support (LTS) ends on May 11, 2022.

TypeScript 4.0 Support

With this most recent update, the Angular has dropped uphold for TypeScript 3.9. Presently Angular 11 just supports TypeScript 4.0. 
 
One of the possible reasons for this update is to accelerate the builds. Angular 11 ensures a faster builds compare to previous versions.

WebPack 5 Support

As you most likely are aware, webpack is utilized to gather huge amount of documents into a single bundled file. Webpack 5 is the most recent version.
 
In any case, Angular 11 offers trial help for webpack 5 and you can utilize it with Angular 11 to evaluate new things. As per the release notes, the Angular team accept that they can stretch out this trial support to accomplish faster builds and tiny bundles once things get steady or stable.
 
If you are curious about the use of Webpack 5 then go to package.json file and add below lines –
"resolutions": {
"webpack": "5.4.0"
}

Moving from TSLint to ESLint

Angular 11 is now moving from TSLint to ESLint. It means developers won’t be able to utilize TSLint in Angular.  Angular is now depreciating the use of TSLint in version 11 and ESLint is recommended.

Note that, TSLint is a  popular linting tools and it was frequently used by Angular developers.

Updated Language Service Preview

In earlier versions of Angular, language service was dependent on View Engine. But in Angular 11, a powerful Ivy based language service is introduced.

Faster Builds

As per my personal development experience, Angular build is a little pain for developers as in some cases it takes too much time to prepare a production build.

But now, Angular 11 comes with faster development and build process with faster compilation with TypeScript 4.0

Updated Hot Module Replacement  Support

Angular supports Hot Module Replacement in short it is HMR. To enable this feature we need to make a little changes in configuration. 

Now with Angular 11, CLI can do this for us. So no need to change in configuration file. With below command we can enable HMR.

ng server --hmr

So, apart from above major changes there are still some of the breaking changes that a developer must be aware.

 

  • 1. Support of IE9, IE0 and IE Mobile is no longer available
  • 2. TypeScript 3.9 is not supported

How to upgrade the Angular projects to Angular 11?

If you are interested in upgrading your existing Angular project to Angular version 11, then run below command.

ng update @angular/cli @angular/code

 

Takeaway

I hope you have now aware about some of the interesting features of Angular 11. But, you will enjoy these features when you will explore more with the real time development.

Thanks for reading this blog.

 

Leave a Comment