为什么 Firefox 上的 React 热重载会自动打开调试器？答案

【问题标题】：Why does React hot-reloading on Firefox automatically open the Debugger?为什么 Firefox 上的 React 热重载会自动打开调试器？
【发布时间】：2020-07-10 14:10:02
【问题描述】：

操作系统： MacOS Catalina 10.15.5
浏览器：启用了 React Developer Tools 4.8.0 插件的 Firefox 78.0.2
IDE： Visual Studio Code 1.46.1
框架：反应

今天突然开始发生这种情况。也许 Firefox 在我不知情的情况下在后台更新，但这一分钟从未发生过，现在它不会停止发生。

问题： 每当我保存一个我正在处理的本地文件时，该文件有一个 React 错误（可能是缺少组件道具，或者语法不正确），Firefox 会重新加载页面，然后将我引导到调试器 DevTools 选项卡，并暂停页面。然后我必须导航回控制台 DevTools 选项卡，并手动重新加载页面。这很令人沮丧。

当浏览器重定向到调试器时，页面上会出现一个对话框，显示“在调试器语句上暂停”。突出显示的调试器代码是：

// --- Welcome to debugging with React DevTools ---
// This debugger statement means that you've enabled the "break on warnings" feature.
// Use the browser's Call Stack panel to step out of this override function-
// to where the original warning or error was logged.
// eslint-disable-next-line no-debugger
debugger;t.apply(void 0,o)};n.__REACT_DEVTOOLS_ORIGINAL_METHOD__=t,// $FlowFixMe property error|warn is not writable.

阻止这种情况的唯一方法是禁用 React 开发者工具插件。我不知道如何禁用“警告中断”功能。任何帮助将不胜感激。

===

编辑：我查看了 React Developer Tools Profiler 选项卡，转到设置，然后是调试，并注意到“警告中断”已被取消选中。仍然不确定解决方案是什么。

【问题讨论】：

我也遇到了同样烦人的问题！

标签： reactjs firefox firefox-addon

【解决方案1】：

这是最新的 React 开发工具 (4.8.0) 中的一个错误：https://github.com/facebook/react/issues/19308

解决方法是打开然后关闭“警告中断”设置。他们已经删除了一个版本（4.8.1）来解决这个问题。

【讨论】：

【解决方案2】：

我有同样的问题。打开然后关闭设置再次修复它。

【讨论】：