Angular SPFx

In this article we are going to provide steps to fix the issue for the Angular SPFx WebPart to run in the Internet Explorer 11(IE11).

While the Angular SPFx webpart runs in the Internet Explorer 11, it will throw an error which is shown below:

A proper solution to this issue for the SPFx, import the core-js polyfills in your WebPart.

To Resolve the above issue, follow the below steps and add the stuffs in your WebPart.

Create Angular SPFx WebPart

Create an SPFX WebPart and integrate Angular in your SPFx WebPart.

Intranet as service

 Add core-js package in your WebPart

Go to the Node.js command prompt and make sure you are pointing to the Project directory and run the below command to include core-js package in your WebPart.

         npm install core-js 

 Add Polyfills.ts file in your WebPart

Create Polyfills.ts file in your WebPart and import the code below in the Polyfills.ts file

 import ‘core-js/es6/symbol’;

import ‘core-js/es6/object’;

import ‘core-js/es6/function’;

import ‘core-js/es6/parse-int’;

import ‘core-js/es6/parse-float’;

import ‘core-js/es6/number’;

import ‘core-js/es6/math’;

import ‘core-js/es6/string’;

import ‘core-js/es6/date’;

import ‘core-js/es6/array’;

import ‘core-js/es6/regexp’;

 if (WeakMap.toString().indexOf(‘function WeakMap()’) === -1) {

    WeakMap = undefined;

}

import ‘core-js/es6/weak-map’;

 // Check for native support of Map vs Polyfill

if (Map.toString().indexOf(‘function Map()’) === -1) {

    Map = undefined;

}

import ‘core-js/es6/map’;

// Check for native support of Map vs Polyfill

if (Set.toString().indexOf(‘function Set()’) === -1) {

    Set = undefined;

}

import ‘core-js/es6/set’;

 export class Polyfills {

 }

 Import code in WebPart.ts file

           Import the Polyfills file in your WebPart.ts file.

       import { Polyfills } from ‘./Polyfills’

 Import es6 reflect in the WebPart.ts file to provide intercepting Javascript operations.

        import ‘core-js/es6/reflect’;

 Paste the below code in the top of the render() method in the WebPart.ts file

        window[‘polyfills’] = Polyfills; 

 Now the Angular SPFx WebPart run in the Internet Explorer 11.

Attached is a sample Angular SPFx WebPart Solution  for the reference which have the solution for the IE11 issue.

We hope you learnt how to solve the Error: Out of stack space in IE11.