Angular 10 Officially Released | What’s new in Angular 10?

Teclogiq
3 min readJul 4, 2020

--

If you’ve been using Angular for your web projects I’m glad to let you know that following this major update to version 10.0.0 the front-end framework created by Google officially deprecates support for Internet Explorer 9, 10 and Internet Explorer Mobile. This comes a few days after Bootstrap 5 also dropped support for all versions of Internet Explorer.

The angular framework has a big version update history. Angular 10 is smaller than previous versions of Angular. New capabilities include a new date range picker in the Angular Material UI component library and warnings for CommonJS imports. CommonJS import warnings alert developers when a dependency packaged with CommonJS could result in larger, slower applications, allowing developers to substitute an ECMAScript module bundle.

Here are the new features and important changes in Angular 10 version:

· TSlib, the runtime library for TypeScript containing helper functions, has been updated to TSlib 2.0. The TSLint static analysis tool for TypeScript has been updated to TSLint 6.

· According to the official blog post, the team behind Angular let us know that after heavy consultation with the community they decided to officially deprecate support for IE 9, 10, and Internet Explorer Mobile.

· Angular Package Format no longer includes ESM5 or FESM5 bundles, saving download and install time when running yarn or npm install for Angular packages and libraries.

· EntryPointFinder, a program-based entry-point finder, has been added that can be seeded from the imports in a program specified by a tsjconfig.json file. This is expected to be faster than the DirectoryWalkerEntryPointFinder when the active program only imports a small proportion of the installed entry points.

· TypeScript 3.9 is now featured, with support for TypeScript 3.8 having been removed. This is a breaking change. TypeScript 3.6 and TypeScript 3.7 also are no longer supported.

· Merging of multiple translation files is supported. Previously, only one translation file per locale was permitted. Now users can specify multiple files per locale, and the transactions from each file will be merged by messaging ID.

· In another breaking change, any resolver that returns EMPTY will cancel navigation. To allow navigation to continue, developers must update the resolvers to update some value, such as default!Empty.

· Reactive forms had a bug that caused valueChanges for controls bound to input fields with number type to fire twice. The listened evet is changed from “change” to “input” to fix this.

· The addition of dependency information and ng-content selectors to metadata. This proposed compiler feature would provide additional metadata useful for tools such as the Angular Language Service, offering the ability to provide suggestions for directives/components defined in libraries.

· In a fix to the core, logic would be added to undecorated-class migration to decorate derived classes of undecorated classes that use Angular features.

· A number of bug fixes have been made including the compiler avoiding undefined expressions in a holey array and the core avoiding a migration error when a non-existent symbol is imported.

How to update to Angular 10

Thanks to the Angular team because they provided us with a detailed guide on how you can update your Angular application to the newest version. You can visit update.angular.io to follow the instructions. You can use the following CLI command to update your application:

ng update @angular/cli @angular/core

You can also read more about updating to Angular version 10 from the official guide.

--

--

Teclogiq

The leading web and mobile app development company. Well versed in Angular/AngularJS, React, Vue, Node, Ionic, NativeScript, Flutter, PHP, LAMP.