73

polyfills.ts file is auto generated while creating an Angular application using Angular Cli. Can anyone explain me what is the use of polyfills.ts file in Angular application.

Praveen Ojha
  • 1,161
  • 1
  • 14
  • 22

4 Answers4

88

Polyfills in angular are few lines of code which make your application compatible for different browsers. The code we write is mostly in ES6(New Features: Overview and Comparison) and is not compatible with IE or firefox and needs some environment setups before being able to be viewed or used in these browsers.

Polyfills.ts was provided by angular to help you do away with need to specifically setup everything.

From Docs

Angular is built on the latest standards of the web platform. Targeting such a wide range of browsers is challenging because they do not support all features of modern browsers.

Read more here

Sajeetharan
  • 216,225
  • 63
  • 350
  • 396
8

Basically polyfills compatible for different browsers especially IE old versions IE8, IE9 and IE10. Angular has new features which written in ES6 and typescript, so polyfills helps to compatible with different browsers.

Manoj
  • 2,000
  • 2
  • 16
  • 21
  • is polyfills.ts file always same? – Vijay Aug 07 '21 at 10:08
  • 2
    May I correct a small error? As far as I know, typescript isn't compatible with any browser at all, not ever fancy new ones. So no browser can interpret the polyfill.ts file, but during your `ng build` the Angular compiler builds files such as main.js (your app) and polyfill.js (the compatibility layer), which are referenced in the index.html, served to your browser. – T_D Aug 31 '21 at 13:11
0

Angular is written in ES6+ language specification. As many of its features are not supported by all the browsers. So by defining them in polyfill it will be compatible in the given browser.

Krusha Shah
  • 9
  • 1
0

This file includes polyfills needed by Angular and is loaded before the app. You can add your own extra polyfills to this file.

This file is divided into 2 sections:

  1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
  2. Application imports. Files imported after ZoneJS should be loaded before your main file.
Kiran Lohar
  • 49
  • 2