反应JS |应用无法在 IOS 和 IE/Edge 上运行

Question

版本边缘：微软边缘 44.18362.449.0 微软 EdgeHTML 18.18362

IE 版本： 11.592.18362.0

希望我们能尽快解决这个问题：

我的 reactjs 项目在构建和部署后正在 chrome 和 firefox - windows 和 android 上运行。但是在 IE、Edge 和 Safari 上（在 IOS 上也是 chrome）我得到一个空白页面并出现以下错误：

对于 IE：

TypeError: Unable to get property 'index' of undefined or null reference
   {
      [functions]: ,
      __proto__: { },
      description: "Unable to get property 'index' of undefined or null reference",
      message: "Unable to get property 'index' of undefined or null reference",
      name: "TypeError",
      number: -2146823281,
      stack: "TypeError: Unable to get property 'index' of undefined or null reference
   at value (https://xxxx/static/js/main.9016f2a2.chunk.js:1:2786)
   at Za (https://xxxx/static/js/2.97b2c280.chunk.js:2:331602)
   at Ja (https://xxxx/static/js/2.97b2c280.chunk.js:2:331451)
   at ju (https://xxxx/static/js/2.97b2c280.chunk.js:2:366905)
   at Nl (https://xxxx/static/js/2.97b2c280.chunk.js:2:351180)
   at Al (https://xxxx/static/js/2.97b2c280.chunk.js:2:351108)
   at wl (https://xxxx/static/js/2.97b2c280.chunk.js:2:348431)
   at gl (https://xxxx/static/js/2.97b2c280.chunk.js:2:345175)
   at oc (https://xxxx/static/js/2.97b2c280.chunk.js:2:373109)
   at Anonymous function (https://xxxx/static/js/2.97b2c280.chunk.js:2:374484)",
      Symbol()_6.wutlnu1cxkj: undefined,
      Symbol(react.async_mode)_y.wutlnu1cxkj: undefined,
      Symbol(react.concurrent_mode)_x.wutlnu1cxkj: undefined,
      Symbol(react.context)_o.wutlnu1cxkj: undefined,
      Symbol(react.element)_i.wutlnu1cxkj: undefined,
      Symbol(react.forward_ref)_p.wutlnu1cxkj: undefined,
      Symbol(react.fragment)_k.wutlnu1cxkj: undefined,
      Symbol(react.fundamental)_u.wutlnu1cxkj: undefined,
      Symbol(react.lazy)_t.wutlnu1cxkj: undefined,
      Symbol(react.memo)_s.wutlnu1cxkj: undefined,
      Symbol(react.portal)_j.wutlnu1cxkj: undefined,
      Symbol(react.profiler)_m.wutlnu1cxkj: undefined,
      Symbol(react.provider)_n.wutlnu1cxkj: undefined,
      Symbol(react.responder)_v.wutlnu1cxkj: undefined,
      Symbol(react.scope)_w.wutlnu1cxkj: undefined,
      Symbol(react.strict_mode)_l.wutlnu1cxkj: undefined,
      Symbol(react.suspense)_q.wutlnu1cxkj: undefined,
      Symbol(react.suspense_list)_r.wutlnu1cxkj: undefined
   }

边缘：

TypeError: Unable to get property 'index' of undefined or null reference

SCRIPT5007: SCRIPT5007: Unable to get property 'index' of undefined or null reference

侧面有趣的事实： 在删除我的 Header 组件导入（以排除故障）之前，出现了同样的消息，但不是 index 它表示 header。我没有名为索引的组件。除了发起 index.js。因此我假设 reactjs 在这些浏览器中有一个基本问题。我认为它在获取文件结构反应构建方面存在问题？

我试过 polyfill 和 core-js/stable，两者对结果没有影响。

*不幸的是，我无法在我的 Ipad 上访问任何开发人员工具来获取 ios chrome 和 safari 的控制台日志。不过我想这是同一个问题。

Answer 1

我发现了BUG

在几乎要放弃之后，我找到了解决办法。我一直在一段一段的重建项目，npm install for npm install，一段一段代码，直到终于找到问题所在：

const language = navigator.language || navigator.userLanguage;

是的，一如既往，一行代码，毁了整个项目。你看，chrome 和 firefox return 使用 navigator 获取浏览器语言时的值不同。

在我的例子中 Chrome 和 Firefox returned en 而 edge returned en-DE

所以在被用来获取正确的语言时 json 打破了引用。因此

"Unable to get property 'index' of undefined or null reference"

Before removing my Header component import (to troubleshoot) this same message came but instead of index it said header. I have no component called index. Except the initiating index.js. Thus I am assuming reactjs has a fundamental issue in these browsers. I assume it has problems of getting the file structures react builds?

当我像这样在 json 中引用语言时：

my_json[language]["index"]

index being the page selector, and so seeming as if it had to do with the component when the selector was

my_json[language]["header"]

所以我实际上是在正确的轨道上，但在 Edge、IE 和 Safari 中出现故障的是我的 "file structure/json structure"。 那么近又那么远。

这是一段相当长的旅程和令人谦卑的经历。最后发现这确实让我很开心！感谢任何至少读过这个问题的人。

找到这个错误信息后就明白了，但目前无法缩小范围。弹出组件名称也让搜索了一段时间。

更新：

这似乎是一个 "issue" 已经报告给 chromium 的错误，它实际上是一个只有语言而不是国家代码的错误 returned。

Chrome browser - navigator.language doesn't return country code

我的修复：

仅 return 语言：

const language = navigator.language.split("-")[0] || navigator.userLanguage.split("-")[0] || "en";

仅return国家代码：

const country = navigator.language.split("-")[1] || navigator.userLanguage.split("-")[1] || "us";

反应JS |应用无法在 IOS 和 IE/Edge 上运行

ReactJS | App not working on IOS and IE/Edge

javascript

safari

internet-explorer

reactjs

microsoft-edge

我发现了BUG

我的修复：