Search code examples
reactjsinternet-explorercreate-react-app

Running React app on Internet explorer 11 results in stackoverflow

I am trying to run my react app on internet explorer 11.

I am using Create-React-App and did everything the docs say -

Added in index.js

import "react-app-polyfill/ie11";
import "react-app-polyfill/stable";
import "fast-text-encoding/text"; //this is to bypass the arrow functions syntax errors//

In package.json

"development": [
  "ie 9",
  "ie 11",
  "last 1 chrome version",
  "last 1 firefox version",
  "last 1 safari version"
]

Now, there are no syntax errors but it says

SCRIPT28: Out of stack space
0.chunk.js (174412,21)
SCRIPT2343: Stack overflow at line: 174412

The stack trace if SCRIPT28 is available -

module.exports = TO_STRING_TAG_SUPPORT ? classofRaw : function (it) {
  var O, tag, result;
  return it === undefined ? 'Undefined' : it === null ? 'Null' // @@toStringTag case
  : typeof (tag = tryGet(O = Object(it), TO_STRING_TAG)) == 'string' ? tag // builtinTag case
  : CORRECT_ARGUMENTS ? classofRaw(O) // ES3 arguments fallback
  : (result = classofRaw(O)) == 'Object' && typeof O.callee == 'function' ? 'Arguments' : result;
};

/***/ }),

/***/ "./node_modules/react-app-polyfill/node_modules/core-js/internals/collection-add-all.js":
/*!**********************************************************************************************!*\
  !*** ./node_modules/react-app-polyfill/node_modules/core-js/internals/collection-add-all.js ***!
  \**********************************************************************************************/
/*! no static exports found */

I have made sure that react-app-polyfill imports are the top level imports, before React-dom and React.

Thanks.

Solution

  • I was able to solve this problem by using an es6 polyfill cdn from Polyfill.io instead of react-app-polyfill. I removed react-app-polyfill and added the cdn script in index.html

    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,es6"></script>

    Now my app works on IE11 and it does not throw stackoverflow error.

    EDIT:: polyfill v3 is out so that is recommended over v2 -

     <script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=default,es6"></script>