Written by

Vignesh

Share

  

Category

see all categories
intranet as a service

How to fix the “out of stack space” issue while run Angular SPFx WebPart in IE11

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. 

Vignesh

Written by Vignesh