{"id":236,"date":"2020-07-10T12:35:58","date_gmt":"2020-07-10T12:35:58","guid":{"rendered":"https:\/\/www.hostarmada.com\/blog\/?p=236"},"modified":"2026-06-16T15:53:29","modified_gmt":"2026-06-16T15:53:29","slug":"get-to-know-the-new-angular-version-10","status":"publish","type":"post","link":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","title":{"rendered":"Angular 10: New Features, Improvements &amp; Upgrade Guide"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Angular 10 introduces new features, performance improvements, stricter development tools, enhanced localization support, and updates to Angular Material, making it easier for developers to build and maintain modern web applications. Released in June 2020, Angular 10 focuses less on major new functionality and more on improving stability, compatibility, and developer productivity across the Angular ecosystem.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 ez-toc-wrap-right counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #565656;color:#565656\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #565656;color:#565656\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#What_Is_New_in_Angular_10\" >What Is New in Angular 10?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#New_Date_Range_Picker\" >New Date Range Picker<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Warnings_about_CommonJS_Imports\" >Warnings about CommonJS Imports<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Optional_Stricer_Settings\" >Optional Stricer Settings<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Major_Changes\" >Major Changes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#New_Default_Browser_Configuration\" >New Default Browser Configuration<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Language_Service\" >Language Service<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Compiler_Update\" >Compiler Update<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#ngcc\" >ngcc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Localization\" >Localization<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Service_Workers\" >Service Workers<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Core\" >Core<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Bug_Fixes\" >Bug Fixes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Converting_pre-Ivy_code\" >Converting pre-Ivy code<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Deprecations_and_Removals\" >Deprecations and Removals<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#How_to_Update_to_Angular_10\" >How to Update to Angular 10<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Angular_10_vs_Angular_9\" >Angular 10 vs Angular 9<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Angular_10_Requirements\" >Angular 10 Requirements<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Supported_Nodejs_Versions\" >Supported Node.js Versions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Supported_TypeScript_Versions\" >Supported TypeScript Versions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Recommended_Development_Environment\" >Recommended Development Environment<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-22\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Is_Angular_10_Still_Supported\" >Is Angular 10 Still Supported?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-23\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Long-Term_Maintenance_Considerations\" >Long-Term Maintenance Considerations<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-24\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Recommendation_for_Production_Applications\" >Recommendation for Production Applications<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-25\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Common_Upgrade_Issues\" >Common Upgrade Issues<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-26\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Dependency_Conflicts\" >Dependency Conflicts<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-27\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#TypeScript_Compatibility_Issues\" >TypeScript Compatibility Issues<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-28\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Third-Party_Library_Migration_Concerns\" >Third-Party Library Migration Concerns<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-29\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Common_Ivy-Related_Problems\" >Common Ivy-Related Problems<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-30\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Official_Resources\" >Official Resources<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-31\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#HostArmada_and_Angular_10\" >HostArmada and Angular 10<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-32\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#Conclusion\" >Conclusion<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-33\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#FAQs\" >FAQs<\/a><\/li><\/ul><\/nav><\/div>\n<h2 id=\"h-what-is-new-in-angular-10\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"What_Is_New_in_Angular_10\"><\/span>What Is New in Angular 10?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 id=\"h-new-date-range-picker\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"New_Date_Range_Picker\"><\/span>New Date Range Picker<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft\"><img decoding=\"async\" width=\"300\" height=\"72\" src=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-300x72.png\" alt=\"angular 10 range picker\" class=\"wp-image-241\" srcset=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-300x72.png 300w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-24x6.png 24w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-36x9.png 36w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10-48x12.png 48w, https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/date-range-picker-angular-10.png 499w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"has-text-align-left wp-block-paragraph\">A new date range picker is included in the Angular Material UI component library. You can use the <code>mat-date-range-input<\/code> and <code>mat-date-range-picker <\/code>Components to utilize the new picker. An overview example of it can be found on <a href=\"https:\/\/stackblitz.com\/angular\/nknyovevygv?file=src%2Fapp%2Fdate-range-picker-overview-example.html\" target=\"_blank\" rel=\"noopener noreferrer\">StackBlitz<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp;<\/p>\n\n\n\n<h3 id=\"h-warnings-about-commonjs-imports\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Warnings_about_CommonJS_Imports\"><\/span>Warnings about CommonJS Imports<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">CommonJS modules could impact your application and make your JavaScript bundles larger than necessary. Angular 10 includes warnings for CommonJS imports, which will alert you when a dependency package with CommonJS may lead to a more extensive and slower application. You may substitute the dependencies with an ECMAScript module (ESM) bundle.<\/p>\n\n\n\n<h3 id=\"h-optional-stricer-settings\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Optional_Stricer_Settings\"><\/span>Optional Stricer Settings<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 allows you to utilize a strict mode project step when creating a new workspace with <code>ng new<\/code>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><code>ng new --strict<\/code><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">When the strict mode is enabled, it improves your project&#8217;s maintainability, helps you detect bugs earlier, and enables the CLI to perform advanced optimizations on your app. The strict flag enables strict mode in TypeScript; sets template type checking to Strict; reduces default bundle budgets by ~75%; disallows the use of type any in the linting rules; and configures your app, excluding unwanted effects, to enable more advanced tree-shaking.<\/p>\n\n\n\n<h3 id=\"h-major-changes\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Major_Changes\"><\/span>Major Changes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Recently, TypeScript released version 3.9, which includes performance improvements, bug fixes, and new features. To keep everything up to date, Angular responds with version 10, which supports it. All Angular users can enjoy elaborate TypeScript configuration, a faster compiler experience, error checking, and quick fixes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The runtime library for TypeScript &#8211; TSlib, has been updated to version 2.0. Along with that, the static analysis tool for TypeScript, &#8211; TSLint,&nbsp; has been updated to version 6.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The project layout has also been updated. A new <code>tsconfig.base.json<\/code> is introduced, and it carries the content of the root <code>tsconfig.json<\/code> file. The &#8220;Solution Style&#8221; concept of the <code>tsconfig.json<\/code> file is included in TypeScript 3.9 to prevail issues caused by the <code>tsconfig.json<\/code> file existing only to reference other <code>tsconfig.json <\/code>files. The additional <code>tsconfig.json<\/code> file improves IDE support as well as build tooling resolve type and package configurations.<\/p>\n\n\n\n<h3 id=\"h-new-default-browser-configuration\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"New_Default_Browser_Configuration\"><\/span>New Default Browser Configuration<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">An update on the browser configuration for new projects has been applied to exclude older and rarely-used browsers, including Internet Explorer 9, Internet Explorer 10, and Internet Explorer Mobile. This change leads to disabling ES5 builds by default for new projects. If you need to enable ES5 builds and differential loading, you have to add the browsers that require it (such as IE or UC Browser) in the <code>.browserslistrc<\/code> file.<\/p>\n\n\n\n<h3 id=\"h-language-service\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Language_Service\"><\/span>Language Service<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Autocompletion is removed from HTML entities, such as <code>&amp;amp;<\/code>, <code>&amp;lt;<\/code>, etc., due to its questionable value and performance cost, and to ensure the compatibility with the core functionality of Angular LS.<\/p>\n\n\n\n<h3 id=\"h-compiler-update\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Compiler_Update\"><\/span>Compiler Update<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">In Angular 10, a compiler interface intended to wrap the actual <code>ngtsc<\/code> compiler is added. The language-service-specific compiler enables multiple type-checking files by using the project interface that creates the necessary ScriptInfos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Name spans have been added for property reads and method calls handled by the compiler.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dependency information and ng-content selectors were added to the metadata. The <a class=\"co gj hx hy hz ia\" href=\"https:\/\/github.com\/angular\/angular\/pull\/35695\" target=\"_blank\" rel=\"noopener nofollow noreferrer\">proposed compiler feature<\/a> is going to provide additional useful metadata for tools, like the Angular Language Service, and provide the ability to accommodate suggestions for directives\/components defined in libraries.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a class=\"co gj hx hy hz ia\" href=\"https:\/\/github.com\/angular\/angular\/pull\/36133\" target=\"_blank\" rel=\"noopener nofollow noreferrer\">Propagation<\/a> of the correct value span in an <code>ExpressionBinding<\/code> of a micro syntax expression to&nbsp;<code>ParsedProperty<\/code> is enabled, which might propagate the span to the template ASTs (both VE and Ivy).<\/p>\n\n\n\n<h3 id=\"h-ngcc\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"ngcc\"><\/span>ngcc<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 introduces an implementation of an A-program-based entry-point-finder, designed to process entry points that can only be reached by a program determined by a <code>tsconfig.json<\/code> file. This option can speed up processing when there are many dependencies installed. However, a relatively small portion of the entry points is actually imported into the application.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The size of the entry-point manifest file is reduced. Knowing the base path for package and entry points avoids the need for storing unnecessary empty arrays. Before,&nbsp;<code>ngcc<\/code> would have to parse the file of the entry point to compute dependencies, even if the entry point did not need to be processed, which required more time for large node modules.<\/p>\n\n\n\n<h3 id=\"h-localization\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Localization\"><\/span>Localization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 includes support for merging multiple translation files. Earlier, only one translation file per locale could be loaded, while now users can define numerous files per locale and merge the translations from each one by a message ID. Users must arrange the files in ascending order, as the merging is done on a first-come basis. If there is an <code class=\"hm kj kk kl km b\">\"a.xlf\u201d<\/code>,&nbsp;<code class=\"hm kj kk kl km b\">\"b.xmb\"<\/code>, and&nbsp;<code class=\"hm kj kk kl km b\">\"c.json\"<\/code> files to be merged, the messages from the <code class=\"hm kj kk kl km b\">\"a.xlf\"<\/code>&nbsp;file will be considered with greater weight.<\/p>\n\n\n\n<h3 id=\"h-service-workers\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Service_Workers\"><\/span>Service Workers<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Previously, when&nbsp;<code>Vary<\/code> headers were taken into account while retrieving resources from the cache, it entirely prevented the retrieval of cached assets and led to unpredictable behavior due to <code class=\"hm kj kk kl km b\">ServiceWorker<\/code> implementation details and inconsistent implementations in different browsers. With Angular 10, <code class=\"hm kj kk kl km b\">Vary<\/code>&nbsp;headers are ignored when retrieving resources from the&nbsp;<code class=\"hm kj kk kl km b\">ServiceWorker<\/code> caches. This can result in retrieving resources even when their headers differ. You need to ensure the Angular <code class=\"hm kj kk kl km b\">ServiceWorker<\/code> is configured to avoid caching affected resources, in case your application requires to differentiate its responses based on header requests.<\/p>\n\n\n\n<h3 id=\"h-core\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Core\"><\/span>Core<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">In Angular 10, all warnings about unknown elements will be logged as errors, which could stumble tools that expect nothing to be registered via <code>console.error<\/code>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Previously, View Engine allowed the generic type to be omitted. Now it is made mandatory for <code class=\"hm kj kk kl km b\">ModuleWithProviders<\/code>. A generic type parameter is required for the <code class=\"hm kj kk kl km b\">ModuleWithProviders<\/code> pattern to work with the Ivy compilation and rendering pipeline, so if you are using the pattern without a generic type in your application code, it will be updated when you upgrade to version 10.<\/p>\n\n\n\n<h3 id=\"h-bug-fixes\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Bug_Fixes\"><\/span>Bug Fixes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Several bugs have been fixed in version 10, including:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The compiler avoids undefined expressions in a holey array.<\/li>\n\n\n\n<li>The core avoids a migration error when a non-existent symbol is imported.<\/li>\n\n\n\n<li>Proper identification of modules affected by overrides in TestBed.<\/li>\n<\/ul>\n\n\n\n<h3 id=\"h-converting-pre-ivy-code\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Converting_pre-Ivy_code\"><\/span>Converting pre-Ivy code<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">All pre-Ivy dependencies from npm should be converted to Ivy dependencies, as Ivy code can only be linked against other Ivy code. Such transformation is required as a precursor to running <code class=\"hm kj kk kl km b\">ngtsc<\/code> on the application. Further compilation and linking operations must be performed on this transformed version of the dependencies.<\/p>\n\n\n\n<h3 id=\"h-deprecations-and-removals\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Deprecations_and_Removals\"><\/span>Deprecations and Removals<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">ESM5 and FESM5 bundles are no longer included in the Angular Package Format. This saves 119MB of download and install time while running <code class=\"hr jd je jf jg b\">yarn<\/code>&nbsp;or&nbsp;<code class=\"hr jd je jf jg b\">npm install<\/code> for Angular packages and libraries. These distributions had become obsolete as Angular generates ES5 from ES2015, which is the default language level consumed by Angular tooling.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">More about deprecations and removals you can find in <a href=\"https:\/\/next.angular.io\/guide\/deprecations\" target=\"_blank\" rel=\"noopener noreferrer\">Angular&#8217;s official documentation<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_Update_to_Angular_10\"><\/span>How to Update to Angular 10<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Upgrading to Angular 10 is generally a straightforward process, but proper preparation can help prevent compatibility issues and reduce downtime. Before beginning the upgrade, review the prerequisites, verify version compatibility, and create a backup of your project.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Prerequisites<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Before upgrading, ensure your development environment meets Angular 10 requirements:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Node.js 10.13 or later (Node.js 12.x LTS recommended)<\/li>\n\n\n\n<li>Angular CLI version compatible with Angular 10<\/li>\n\n\n\n<li>TypeScript 3.9<\/li>\n\n\n\n<li>npm or Yarn package manager<\/li>\n\n\n\n<li>A clean Git working directory with all current changes committed<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">You can verify your current versions using:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;HTML&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;html&quot;}\">node -v\nnpm -v\nng version\n<\/pre><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">Create a Backup Before Upgrading<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Before making any framework upgrades, create a complete backup of your project.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Recommended backup methods include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Creating a Git commit before starting the upgrade<\/li>\n\n\n\n<li>Creating a dedicated upgrade branch<\/li>\n\n\n\n<li>Backing up configuration files such as:\n<ul class=\"wp-block-list\">\n<li>package.json<\/li>\n\n\n\n<li>angular.json<\/li>\n\n\n\n<li>tsconfig.json<\/li>\n\n\n\n<li>environment configuration files<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Example:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;HTML&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;html&quot;}\">git checkout -b angular-10-upgrade\ngit add .\ngit commit -m &quot;Backup before Angular 10 upgrade&quot;\n<\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">This provides a rollback point if any issues occur during the migration process.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Check Version Compatibility<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Before running the upgrade command, verify that your project dependencies support Angular 10.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Pay special attention to:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Angular Material packages<\/li>\n\n\n\n<li>Angular CDK<\/li>\n\n\n\n<li>RxJS versions<\/li>\n\n\n\n<li>TypeScript version requirements<\/li>\n\n\n\n<li>Third-party Angular libraries<\/li>\n\n\n\n<li>State management packages such as NgRx<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Applications running Angular 8 or earlier should typically upgrade one major version at a time rather than skipping directly to Angular 10.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can review official upgrade recommendations using Angular&#8217;s Update Guide.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Run the Upgrade<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Once compatibility has been verified, update Angular CLI and Angular Core:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;HTML&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;html&quot;}\">ng update @angular\/cli @angular\/core\n<\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">If Angular Material is installed, update it as well:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;HTML&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;html&quot;}\">ng update @angular\/material\n<\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Angular CLI will automatically apply available migrations and update project configuration files where required.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Common Upgrade Issues<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">While most projects upgrade successfully, several issues are commonly encountered during migration.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Dependency Conflicts<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Some packages may require newer versions before Angular 10 can be installed.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Common symptoms include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>npm dependency resolution failures<\/li>\n\n\n\n<li>Peer dependency warnings<\/li>\n\n\n\n<li>Build errors after installation<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Review package documentation and update incompatible libraries before proceeding.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">TypeScript Compatibility Problems<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 requires TypeScript 3.9 support.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You may encounter:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>New type-checking errors<\/li>\n\n\n\n<li>Deprecated syntax warnings<\/li>\n\n\n\n<li>Compilation failures in custom code<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Address these issues before deploying the upgraded application.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Third-Party Library Compatibility<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Older Angular libraries may not support Angular 10 or Ivy.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Potential problems include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Missing metadata files<\/li>\n\n\n\n<li>Build failures<\/li>\n\n\n\n<li>Runtime dependency injection errors<\/li>\n\n\n\n<li>Unsupported package versions<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Whenever possible, update third-party packages to versions officially supporting Angular 10.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Ivy-Related Issues<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 continues using the Ivy rendering engine introduced in Angular 9.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Common Ivy-related issues include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Library compatibility warnings<\/li>\n\n\n\n<li>Template compilation errors<\/li>\n\n\n\n<li>Metadata generation problems<\/li>\n\n\n\n<li>Runtime rendering inconsistencies<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Most issues can be resolved by updating dependencies and rebuilding the project using the latest Angular CLI tools.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Test the Application Thoroughly<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">After completing the upgrade:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Run all automated tests<\/li>\n\n\n\n<li>Verify application builds successfully<\/li>\n\n\n\n<li>Review browser console output<\/li>\n\n\n\n<li>Test critical application functionality<\/li>\n\n\n\n<li>Validate production deployment procedures<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Example:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;HTML&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;html&quot;}\">ng test\nng build --prod\n<\/pre><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">Use Angular&#8217;s Official Update Tool<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">For project-specific upgrade instructions, Angular provides an interactive update guide that generates recommendations based on your current and target versions.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Official Update Tool:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/update.angular.io\">https:\/\/update.angular.io<\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Following the official guidance and performing thorough testing will help ensure a smooth migration to Angular 10 with minimal disruption to your application.<\/p>\n\n\n\n<h2 id=\"h-angular-10-vs-angular-9\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Angular_10_vs_Angular_9\"><\/span>Angular 10 vs Angular 9<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 builds on the foundation introduced by Angular 9 and the Ivy rendering engine. While Angular 9 focused on the successful rollout of Ivy as the default compiler and runtime, Angular 10 improves stability, developer experience, tooling, and ecosystem compatibility.<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>Feature<\/th><th>Angular 9<\/th><th>Angular 10<\/th><\/tr><\/thead><tbody><tr><td>Ivy Rendering Engine<\/td><td>Introduced as default<\/td><td>Improved stability and tooling support<\/td><\/tr><tr><td>TypeScript Support<\/td><td>TypeScript 3.6\u20133.8<\/td><td>TypeScript 3.9 support<\/td><\/tr><tr><td>Browser Support<\/td><td>Legacy browser support included<\/td><td>Older browsers removed from default configuration<\/td><\/tr><tr><td>CLI Improvements<\/td><td>Ivy migration tooling<\/td><td>Stricter project configuration and improved warnings<\/td><\/tr><tr><td>Angular Material<\/td><td>Basic component updates<\/td><td>New Date Range Picker component<\/td><\/tr><tr><td>Localization<\/td><td>Single translation file per locale<\/td><td>Multiple translation files per locale supported<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">For developers already using Angular 9, upgrading to Angular 10 provides improved maintainability, better compiler performance, stronger type checking, and a more streamlined development experience.<\/p>\n\n\n\n<h2 id=\"h-angular-10-requirements\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Angular_10_Requirements\"><\/span>Angular 10 Requirements<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Before upgrading to Angular 10, ensure your development environment meets the recommended requirements.<\/p>\n\n\n\n<h3 id=\"h-supported-node-js-versions\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Supported_Nodejs_Versions\"><\/span>Supported Node.js Versions<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 officially supports:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Node.js 10.13 or later<\/li>\n\n\n\n<li>Node.js 12.x LTS<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Using a supported Node.js version helps avoid package installation issues and compatibility problems during upgrades.<\/p>\n\n\n\n<h3 id=\"h-supported-typescript-versions\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Supported_TypeScript_Versions\"><\/span>Supported TypeScript Versions<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 supports:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>TypeScript 3.9<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">The update introduces performance improvements, bug fixes, and enhanced type checking capabilities that benefit Angular applications.<\/p>\n\n\n\n<h3 id=\"h-recommended-development-environment\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Recommended_Development_Environment\"><\/span>Recommended Development Environment<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">For the best experience with Angular 10, consider the following setup:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Latest Angular CLI version compatible with Angular 10<\/li>\n\n\n\n<li>Visual Studio Code or another modern TypeScript-compatible IDE<\/li>\n\n\n\n<li>Node.js LTS release<\/li>\n\n\n\n<li>Git for version control<\/li>\n\n\n\n<li>npm or Yarn package manager<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Maintaining an up-to-date development environment can significantly reduce upgrade complications and improve application performance.<\/p>\n\n\n\n<h2 id=\"h-is-angular-10-still-supported\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Is_Angular_10_Still_Supported\"><\/span>Is Angular 10 Still Supported?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Angular follows a predictable release cycle, typically introducing two major releases per year. Each version receives active support for a limited period before reaching end-of-life status.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Because Angular 10 was released in 2020, it is no longer actively supported by the Angular team. This means:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>No new security updates<\/li>\n\n\n\n<li>No bug fixes<\/li>\n\n\n\n<li>No compatibility updates for modern tooling<\/li>\n\n\n\n<li>No official support for newer browser and platform changes<\/li>\n<\/ul>\n\n\n\n<h3 id=\"h-long-term-maintenance-considerations\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Long-Term_Maintenance_Considerations\"><\/span>Long-Term Maintenance Considerations<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Organizations still running Angular 10 applications should evaluate the risks associated with outdated dependencies and unsupported frameworks. Legacy applications may experience:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Security vulnerabilities<\/li>\n\n\n\n<li>Compatibility issues with modern browsers<\/li>\n\n\n\n<li>Dependency conflicts with newer packages<\/li>\n\n\n\n<li>Increased maintenance costs<\/li>\n<\/ul>\n\n\n\n<h3 id=\"h-recommendation-for-production-applications\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Recommendation_for_Production_Applications\"><\/span>Recommendation for Production Applications<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">For new projects and actively maintained production applications, using a newer Angular version is strongly recommended. Current Angular releases provide improved performance, security enhancements, standalone components, modern tooling support, and ongoing maintenance from the Angular team.<\/p>\n\n\n\n<h2 id=\"h-common-upgrade-issues\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Common_Upgrade_Issues\"><\/span>Common Upgrade Issues<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Although upgrading to Angular 10 is generally straightforward, developers may encounter several common challenges.<\/p>\n\n\n\n<h3 id=\"h-dependency-conflicts\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Dependency_Conflicts\"><\/span>Dependency Conflicts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Some third-party packages may not immediately support Angular 10. Before upgrading:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Review package compatibility requirements<\/li>\n\n\n\n<li>Update dependencies to supported versions<\/li>\n\n\n\n<li>Remove abandoned or deprecated packages<\/li>\n<\/ul>\n\n\n\n<h3 id=\"h-typescript-compatibility-issues\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"TypeScript_Compatibility_Issues\"><\/span>TypeScript Compatibility Issues<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Angular 10 requires TypeScript 3.9 support. Applications relying on older TypeScript versions may encounter:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Compilation errors<\/li>\n\n\n\n<li>Stricter type checking failures<\/li>\n\n\n\n<li>Deprecated syntax warnings<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Review TypeScript configuration files and address any newly reported issues before deploying updates.<\/p>\n\n\n\n<h3 id=\"h-third-party-library-migration-concerns\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Third-Party_Library_Migration_Concerns\"><\/span>Third-Party Library Migration Concerns<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Certain Angular libraries may require additional updates to support Angular 10 and Ivy.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Potential issues include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Missing type definitions<\/li>\n\n\n\n<li>Deprecated APIs<\/li>\n\n\n\n<li>Package compatibility warnings<\/li>\n\n\n\n<li>Build failures during compilation<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Always review release notes for critical third-party packages before upgrading.<\/p>\n\n\n\n<h3 id=\"h-common-ivy-related-problems\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Common_Ivy-Related_Problems\"><\/span>Common Ivy-Related Problems<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Since Angular 10 continues using Ivy as the default rendering engine, some applications may experience:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Library compatibility issues<\/li>\n\n\n\n<li>Build-time warnings<\/li>\n\n\n\n<li>Metadata generation errors<\/li>\n\n\n\n<li>Runtime injection problems<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Most issues can be resolved by updating dependencies and ensuring all packages support Ivy compilation.<\/p>\n\n\n\n<h2 id=\"h-official-resources\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Official_Resources\"><\/span>Official Resources<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">For the most current information about Angular releases and upgrades, consult the official Angular resources:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Angular Changelog: <a href=\"https:\/\/github.com\/angular\/angular\/blob\/main\/CHANGELOG.md\">https:\/\/github.com\/angular\/angular\/blob\/main\/CHANGELOG.md<\/a><\/li>\n\n\n\n<li>Angular Update Guide: <a href=\"https:\/\/update.angular.io\/\">https:\/\/update.angular.io<\/a><\/li>\n\n\n\n<li>Angular Documentation: <a href=\"https:\/\/angular.dev\/\">https:\/\/angular.dev<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">These resources provide detailed migration instructions, compatibility information, and best practices for maintaining Angular applications.<\/p>\n\n\n\n<h2 id=\"h-hostarmada-and-angular-10\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"HostArmada_and_Angular_10\"><\/span>HostArmada and Angular 10<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">When our Web Hosting Service Architect and our Innovations Captain were designing the core set of services that HostArmada would offer, they did not miss Angular. From the very beginning, we incorporated the Angular-CLI tool in every service that we offer so in order to use it our customers will have to access the SSH service for their web hosting account and then simply type<code>ng<\/code>to see a complete list of all the available commands related to the Angular-CLI tool. Still, should you face any issue with the usage of the tool, please do not hesitate to contact our <a href=\"https:\/\/hostarmada.com\/technical-support\/\">Technical Support Crew<\/a> and they will do their very best to resolve the issue or answer any Angular related questions you might have.<\/p>\n\n\n\n<h2 id=\"h-conclusion\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Stephen Fluin mentioned that Angular is increasing its investments in working with the community. For three weeks, they have managed to resolve over 700 issues across the framework, tooling, and components. Angular&#8217;s goal is to release two major versions each year to keep everything up-to-date and synchronized with the rest of the JavaScript ecosystem. They have even stated that the release of Angular version 11 is planned for this fall.<\/p>\n\n\n\n<h2 id=\"h-faqs\" class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"FAQs\"><\/span>FAQs<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<div class=\"schema-faq wp-block-yoast-faq-block\"><div class=\"schema-faq-section\" id=\"faq-question-1781625090671\"><strong class=\"schema-faq-question\">What is Angular 10?<\/strong> <p class=\"schema-faq-answer\">Angular 10 is the tenth major release of Google&#8217;s Angular framework. It includes improvements to performance, tooling, TypeScript compatibility, Angular Material components, and localization features while enhancing overall developer experience.<\/p> <\/div> <div class=\"schema-faq-section\" id=\"faq-question-1781625098046\"><strong class=\"schema-faq-question\">What are the biggest new features in Angular 10?<\/strong> <p class=\"schema-faq-answer\">Some of the most notable Angular 10 updates include the Angular Material Date Range Picker, TypeScript 3.9 support, stricter project settings, CommonJS dependency warnings, improved localization capabilities, and compiler enhancements.<\/p> <\/div> <div class=\"schema-faq-section\" id=\"faq-question-1781625098663\"><strong class=\"schema-faq-question\">Is Angular 10 still supported?<\/strong> <p class=\"schema-faq-answer\">No. Angular 10 has reached end-of-life and no longer receives security updates, bug fixes, or official support. Organizations running Angular 10 applications should consider upgrading to a currently supported Angular version.<\/p> <\/div> <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Angular 10 introduces new features, performance improvements, stricter development tools, enhanced localization support, and updates to Angular Material, making it easier for developers to build and maintain modern web applications. Released in June 2020, Angular 10 focuses less on major new functionality and more on improving stability, compatibility, and developer productivity across the Angular ecosystem. [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":283,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[14,18,31],"tags":[],"class_list":["post-236","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development","category-open-source","category-technology"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.9 (Yoast SEO v27.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Angular 10: New Features, Improvements &amp; Upgrade Guide - HostArmada Blog<\/title>\n<meta name=\"description\" content=\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Angular 10: New Features, Improvements &amp; Upgrade Guide\" \/>\n<meta property=\"og:description\" content=\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/\" \/>\n<meta property=\"og:site_name\" content=\"HostArmada Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-07-10T12:35:58+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-16T15:53:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Sebahat Hadzhi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sebahat Hadzhi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"},\"author\":{\"name\":\"Sebahat Hadzhi\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/person\\\/321a9ca8a79eeda667c44fc5e7390392\"},\"headline\":\"Angular 10: New Features, Improvements &amp; Upgrade Guide\",\"datePublished\":\"2020-07-10T12:35:58+00:00\",\"dateModified\":\"2026-06-16T15:53:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"},\"wordCount\":2533,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"articleSection\":[\"Development\",\"OpenSource\",\"Technology\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#respond\"]}]},{\"@type\":[\"WebPage\",\"FAQPage\"],\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\",\"name\":\"Angular 10: New Features, Improvements &amp; Upgrade Guide - HostArmada Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"datePublished\":\"2020-07-10T12:35:58+00:00\",\"dateModified\":\"2026-06-16T15:53:29+00:00\",\"description\":\"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#breadcrumb\"},\"mainEntity\":[{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625090671\"},{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098046\"},{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098663\"}],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"contentUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/angular10.png\",\"width\":1200,\"height\":600,\"caption\":\"Angular 10 Released\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"HostArmada Blog\",\"item\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Angular 10: New Features, Improvements &amp; Upgrade Guide\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\",\"name\":\"HostArmada Blog\",\"description\":\"HostArmada official blog. Useful web hosting related articles.\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#organization\",\"name\":\"HostArmada Blog\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/Group-7823.png\",\"contentUrl\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/Group-7823.png\",\"width\":240,\"height\":25,\"caption\":\"HostArmada Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/#\\\/schema\\\/person\\\/321a9ca8a79eeda667c44fc5e7390392\",\"name\":\"Sebahat Hadzhi\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g\",\"caption\":\"Sebahat Hadzhi\"},\"description\":\"Sebahat is a young and bright person who had become an invaluable part of our team. Started as a Customer Care Representative who quickly evolved into a Tech-savvy well familiar with every support layer of the company. Driven by the aim to constantly improve our customers\u2019 experience she is committed to enhancing the extraordinary support we deliver.\",\"sameAs\":[\"https:\\\/\\\/hostarmada.com\\\/\"],\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/author\\\/sebahat-hadzi\\\/\"},{\"@type\":\"Question\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625090671\",\"position\":1,\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625090671\",\"name\":\"What is Angular 10?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Angular 10 is the tenth major release of Google's Angular framework. It includes improvements to performance, tooling, TypeScript compatibility, Angular Material components, and localization features while enhancing overall developer experience.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Question\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098046\",\"position\":2,\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098046\",\"name\":\"What are the biggest new features in Angular 10?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Some of the most notable Angular 10 updates include the Angular Material Date Range Picker, TypeScript 3.9 support, stricter project settings, CommonJS dependency warnings, improved localization capabilities, and compiler enhancements.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Question\",\"@id\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098663\",\"position\":3,\"url\":\"https:\\\/\\\/www.hostarmada.com\\\/blog\\\/get-to-know-the-new-angular-version-10\\\/#faq-question-1781625098663\",\"name\":\"Is Angular 10 still supported?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"No. Angular 10 has reached end-of-life and no longer receives security updates, bug fixes, or official support. Organizations running Angular 10 applications should consider upgrading to a currently supported Angular version.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Angular 10: New Features, Improvements &amp; Upgrade Guide - HostArmada Blog","description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","og_locale":"en_US","og_type":"article","og_title":"Angular 10: New Features, Improvements &amp; Upgrade Guide","og_description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","og_url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","og_site_name":"HostArmada Blog","article_published_time":"2020-07-10T12:35:58+00:00","article_modified_time":"2026-06-16T15:53:29+00:00","og_image":[{"width":1200,"height":600,"url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","type":"image\/png"}],"author":"Sebahat Hadzhi","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Sebahat Hadzhi","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#article","isPartOf":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"},"author":{"name":"Sebahat Hadzhi","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/person\/321a9ca8a79eeda667c44fc5e7390392"},"headline":"Angular 10: New Features, Improvements &amp; Upgrade Guide","datePublished":"2020-07-10T12:35:58+00:00","dateModified":"2026-06-16T15:53:29+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"},"wordCount":2533,"commentCount":0,"publisher":{"@id":"https:\/\/www.hostarmada.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","articleSection":["Development","OpenSource","Technology"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#respond"]}]},{"@type":["WebPage","FAQPage"],"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/","name":"Angular 10: New Features, Improvements &amp; Upgrade Guide - HostArmada Blog","isPartOf":{"@id":"https:\/\/www.hostarmada.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","datePublished":"2020-07-10T12:35:58+00:00","dateModified":"2026-06-16T15:53:29+00:00","description":"Angular releases a new major update. Learn what has been changed, updated, improved and peprecated in the latest version 10 of the propular framework.","breadcrumb":{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#breadcrumb"},"mainEntity":[{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625090671"},{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098046"},{"@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098663"}],"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#primaryimage","url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","contentUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2020\/07\/angular10.png","width":1200,"height":600,"caption":"Angular 10 Released"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"HostArmada Blog","item":"https:\/\/www.hostarmada.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Angular 10: New Features, Improvements &amp; Upgrade Guide"}]},{"@type":"WebSite","@id":"https:\/\/www.hostarmada.com\/blog\/#website","url":"https:\/\/www.hostarmada.com\/blog\/","name":"HostArmada Blog","description":"HostArmada official blog. Useful web hosting related articles.","publisher":{"@id":"https:\/\/www.hostarmada.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hostarmada.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hostarmada.com\/blog\/#organization","name":"HostArmada Blog","url":"https:\/\/www.hostarmada.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2026\/06\/Group-7823.png","contentUrl":"https:\/\/www.hostarmada.com\/blog\/wp-content\/uploads\/2026\/06\/Group-7823.png","width":240,"height":25,"caption":"HostArmada Blog"},"image":{"@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.hostarmada.com\/blog\/#\/schema\/person\/321a9ca8a79eeda667c44fc5e7390392","name":"Sebahat Hadzhi","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d8c5b06d80cb9a50a2b33677e9a2fb8f8a6fc75bf27ec9d30f96afc17ba6bd2f?s=96&d=mm&r=g","caption":"Sebahat Hadzhi"},"description":"Sebahat is a young and bright person who had become an invaluable part of our team. Started as a Customer Care Representative who quickly evolved into a Tech-savvy well familiar with every support layer of the company. Driven by the aim to constantly improve our customers\u2019 experience she is committed to enhancing the extraordinary support we deliver.","sameAs":["https:\/\/hostarmada.com\/"],"url":"https:\/\/www.hostarmada.com\/blog\/author\/sebahat-hadzi\/"},{"@type":"Question","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625090671","position":1,"url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625090671","name":"What is Angular 10?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"Angular 10 is the tenth major release of Google's Angular framework. It includes improvements to performance, tooling, TypeScript compatibility, Angular Material components, and localization features while enhancing overall developer experience.","inLanguage":"en-US"},"inLanguage":"en-US"},{"@type":"Question","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098046","position":2,"url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098046","name":"What are the biggest new features in Angular 10?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"Some of the most notable Angular 10 updates include the Angular Material Date Range Picker, TypeScript 3.9 support, stricter project settings, CommonJS dependency warnings, improved localization capabilities, and compiler enhancements.","inLanguage":"en-US"},"inLanguage":"en-US"},{"@type":"Question","@id":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098663","position":3,"url":"https:\/\/www.hostarmada.com\/blog\/get-to-know-the-new-angular-version-10\/#faq-question-1781625098663","name":"Is Angular 10 still supported?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"No. Angular 10 has reached end-of-life and no longer receives security updates, bug fixes, or official support. Organizations running Angular 10 applications should consider upgrading to a currently supported Angular version.","inLanguage":"en-US"},"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/comments?post=236"}],"version-history":[{"count":48,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236\/revisions"}],"predecessor-version":[{"id":7096,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/posts\/236\/revisions\/7096"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/media\/283"}],"wp:attachment":[{"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/media?parent=236"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/categories?post=236"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostarmada.com\/blog\/wp-json\/wp\/v2\/tags?post=236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}