React not rendering in IE compatibility view

I am using from create-react-app and not rendering in IE11

On IE compatibility mode is checked for intranet sites. So after deployment it uses IE5 or IE7 emulator and this shows blank page with some errors in console.

I tried to different workarounds:

  1. using X-UA-Compatible tag using react-helmet
  2. setting response header in IIS for X-UA-Compatible
  3. setting X-UA-Compatible header in web.config

None of these work.

I found this meta tag needs to be set as first child of the head. But using react-helmet it is not possible to place a tag at very top.

Can anyone faced similar issue?

2 answers

  • answered 2019-12-13 05:57 Muhammad Murad Haider

    The problem could be ECMA 6 compatibility with IE 11. You can transpile your code to ES5 (with babel) as ES5 is supported by IE.

  • answered 2019-12-13 08:48 Yu Zhou

    From the official documentation, react doesn't support older browsers below IE 9. You say you run it in compatibility mode which is IE 5 and IE 7. React doesn't support these two IE versions. You could add this meta tag <meta http-equiv="X-UA-Compatible" content="IE=edge"> in index.html to override the compatibility view. I tried to add it not as the first child of head and it could also work.

    Besides, does your app work well in IE 11 without compatibility view? You could also follow this answer to make it supported on IE 11.