title: React App - Bable Polyfill not working correctly IE11
body: <p>I am working on a react app that has a reported issue that I am scratchning my head on and seems that a number of people have also had this issue.</p>
  
  <p>The error in the console is 
  <a href="https://i.stack.imgur.com/OqwNN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OqwNN.png" alt="enter image description here"></a></p>
  
  <p>All attempts to resolve have been unsuccessful including these links below:</p>
  
  <p><a href="https://stackoverflow.com/questions/61208416/react-polyfills-for-ie-9">React polyfills for ie &gt;= 9</a></p>
  
  <p><a href="https://stackoverflow.com/questions/60105826/react-app-not-rendering-in-ie-11-even-with-polyfills">React app not rendering in IE 11 even with polyfills</a></p>
  
  <p><a href="https://github.com/facebook/create-react-app/issues/8197" rel="nofollow noreferrer">https://github.com/facebook/create-react-app/issues/8197</a></p>
  
  <p>My index.tsx file looks this </p>
  
  <pre><code>import 'react-app-polyfill/ie11';
  import 'react-app-polyfill/stable';
  import 'fast-text-encoding/text';
  import * as React from 'react'
  import * as ReactDOM from 'react-dom'
  import { hot } from 'react-hot-loader/root'
  import App from './App'
  </code></pre>
  
  <p>I have included this in my package.json file </p>
  
  <pre><code>"browserslist": {
   "production": [
     "&gt;0.2%",
     "not dead",
     "not op_mini all"
   ],
   "development": [
     "ie 11",
     "last 1 chrome version",
     "last 1 firefox version",
     "last 1 safari version"
   ]
  }
  </code></pre>
  
  <p>The error in the console of IE11 points to bundle.js as the problem and more specifically these arrow functions. </p>
  
  <pre><code> const is = {
    arr: Array.isArray,
    obj: a =&gt; Object.prototype.toString.call(a) === '[object Object]', // This is where the error is reported. 
    fun: a =&gt; typeof a === 'function',
    str: a =&gt; typeof a === 'string',
    num: a =&gt; typeof a === 'number',
    und: a =&gt; a === void 0,
    nul: a =&gt; a === null,
    set: a =&gt; a instanceof Set,
    map: a =&gt; a instanceof Map,
  
    equ(a, b) {
      if (typeof a !== typeof b) return false;
      if (is.str(a) || is.num(a)) return a === b;
      if (is.obj(a) &amp;&amp; is.obj(b) &amp;&amp; Object.keys(a).length + Object.keys(b).length === 0) return true;
      let i;
  
    for (i in a) if (!(i in b)) return false;
  
    for (i in b) if (a[i] !== b[i]) return false;
  
    return is.und(i) ? a === b : true;
   }
  
  };
  </code></pre>
  
  <p>My ts config file looks like this :</p>
  
  <pre><code>  {
    "compilerOptions": {
      "allowSyntheticDefaultImports": true,
      "esModuleInterop": true,
      "outDir": "./dist/",
      "sourceMap": true,
      "strict": true,
      "noImplicitReturns": true,
      "noImplicitAny": true,
      "module": "es6",          &lt;=== //// Could this and target be something to do with the issue?
      "moduleResolution": "node",
      "target": "es5",          &lt;=== //// Could this and module be something to do with the issue?
      "allowJs": true,          
      "checkJs": true,
      "jsx": "react",
      "baseUrl": ".",
      "types": ["react", "node", "jest"],
      "paths": {
        "assets/*": ["src/assets/*"],
        "config/*": ["src/config/*"],
        "containers/*": ["src/containers/*"],
        "hooks/*": ["src/hooks/*"],
        "providers/*": ["src/providers/*"],
        "routes/*": ["src/routes/*"],
        "store/*": ["src/store/*"],
        "tests/*": ["src/tests/*"],
        "theme/*": ["src/assets/theme/*"],
        "constants/*": ["src/utils/constants/*"],
        "translations/*": ["src/translations/*"],
        "utils/*": ["src/utils/*"],
        "views/*": ["src/views/*"]
      }
    },
    "include": ["./src/**/*", "tsconfig.json", "./typings/**/*.ts"]
  }
  </code></pre>
  
  <p>I would be grateful for any and all assistance on this in terms of what the fix is \ could be, what I need to look into that I may have missed etc. </p>