使用反应脚本启动时透明 iFrame 会阻止鼠标事件

Question

有人遇到过这个问题吗？

使用时react-scripts start，第一次加载时一切似乎都正常。一旦对文件进行更改，所有鼠标事件似乎都会停止工作（无法单击按钮、输入、没有工具提示等），即使浏览器似乎已更新。

如果我刷新页面，事件会再次起作用，直到文件发生更改。

这在生产中不是问题，因为观察者不参与其中。

有任何想法吗？

编辑：
我发现了问题，但我不确定解决方案是什么。当观察者重新加载时，iFrame 似乎被添加到 DOM 中。看起来它与许可证有关。iFrame 中的主体是空的，但有一些缩小的 JS，在顶行有注释：

/*! 有关许可证信息，请参阅 iframe-bundle.js.LICENSE.txt */

有谁知道如何防止此 iFrame 出现。

Answer 1

这就是为我解决的问题：

npm upgrade react-scripts

点对点:)我正在使用 v4.* 和 React v17.*。升级到 v5 有效。非常感谢！ (4认同)
很高兴不仅仅是我。真是令人沮丧！任何人都知道这是如何结束的吗？不幸的是，运行 5.0.0 会出现无数其他错误，例如“找不到模块：错误：无法解析 'C:\... 中的 'fs'” (2认同)
那么，如果 v5 由于 webpack 5 不再包含 polyfill 而崩溃了，我们该怎么办？ (2认同)

Answer 2

这对我有用：

"react-error-overlay": "6.0.9",

并将固定依赖项版本添加到package.json的解决方案部分：

"resolutions": {
  "//": "See https://github.com/facebook/create-react-app/issues/11773",
  "react-error-overlay": "6.0.9"
},

注意：请将此依赖项放入package.json"resolutions":{ }中。它在 "devDependencies" 或 "dependencies" 中不起作用。