消除React Native中的“远程调试器在后台选项卡中”警告

我已经开始了一个新的React Native项目，并且不断收到以下警告：

远程调试器位于背景选项卡中，这可能会导致应用运行缓慢。通过突出显示选项卡（或在单独的窗口中打开）来解决此问题。

这有点烦人，所以我想知道如何摆脱它？我在Chrome中运行调试器，将其移至单独的窗口，但没有帮助。

为了消除整个项目中的警告，请将以下内容添加到最外层的Javascript文件中（大部分时间index.js用于React Native）

对于本机 v0.57+：

import { YellowBox } from 'react-native';
YellowBox.ignoreWarnings(['Remote debugger']);

从官方的React Native文档中引用以下内容：

https://facebook.github.io/react-native/docs/debugging.html

本机 v0.56 或以下：

在代码中尽早添加以下内容：

console.ignoredYellowBox = ['Remote debugger'];

简单，简单且针对该错误。为我工作。可以替代您想要的任何文本。

这个解决方案对我有用

在单独的窗口上打开/移动http：// localhost：8081 / debugger-ui（远程调试的默认路径）

也许可以帮助:)

您可以使用https://github.com/jhen0409/react-native-debugger上可用的React Native Debugger。这是一个用于在开发过程中调试React Native应用程序的独立应用程序。

1. 移动 http://localhost:*****/debugger-ui在单独的窗口上。
2. 重新启动Remote JS Debugging。

这是因为在浏览器中使用React Native Remote Debugger UI选项卡打开了许多选项卡。我也面临同样的问题。

要克服此警告消息，您可以使用以下任一方法：

• 打开一个隐身标签，然后将http：// localhost：8081 / debugger-ui粘贴到地址栏上，然后按Enter键。最后重新加载应用程序（Command + R）。

• 关闭浏览器中的所有标签。仅打开1个选项卡，然后单击http：// locahost：8081 / debugger-ui，然后重新加载应用程序（Command + R）。

正如@jakeforaker在评论之一中提到的那样。只需在单独的窗口中打开远程调试器，而不是在浏览器现有窗口中的选项卡中打开警告，就可以消除警告（不过您必须重新加载模拟器）。

正如警告所言，将远程调试器与其他选项卡保留在同一窗口中

可能会导致应用运行缓慢

因此，我认为像@kjonsson所提到的那样简单地抑制警告console.ignoredYellowBox = ['Remote debugger'];似乎不是最好的解决方案。

当我关闭所有打开的Chrome窗口并再次启动“删除调试”时，此问题已解决。我以前曾打开过Chrome浏览器窗口，因此“似乎”打开它们会降低性能。

自2017年3月提交以来，您可以启用“维护优先级”复选框。启用后，它会静默播放base64编码的.wav文件，以防止调试器的浏览器选项卡进入低功耗模式，这会影响websocket的性能。这将有效防止您描述的警告。

我认为已接受的答案不再准确（至少对于React Native v0.57 +）。

现在正确的代码是：

import { YellowBox } from 'react-native';
YellowBox.ignoreWarnings(['Remote debugger']);

从官方的React Native文档中引用以下内容：

https://facebook.github.io/react-native/docs/debugging.html

我在Macbook上。我通过将“调试器”窗口置于主桌面上而不是将其放置在它认为位于“背景”中的单独桌面上来解决此问题。

昨天我弹出了同样的问题。谷歌搜索导致了这个Stack Overflow帖子。在其中之一（由adriansprod撰写）中，他建议：

Chrome debugger in it's own window fixes. But annoying problem

您的React Native调试器可能不在自己的Chrome浏览器窗口中，而是在Chrome浏览器标签中。正如adriansprod建议的那样，将其作为自己的窗口拉出，为我解决了此问题。

（非常烦人的）错误消息由 debuggerWorker.js，可惜它不包含任何配置选项来关闭该消息。因此，暂时没有办法配置您的应用程序以禁用该消息。

相关代码概述如下（适用原始许可证）：

var visibilityState;
var showVisibilityWarning = (function() {
  var hasWarned = false;
  return function() {
    // Wait until `YellowBox` gets initialized before displaying the warning.
    if (hasWarned || console.warn.toString().includes('[native code]')) {
      return;
    }
    hasWarned = true;
    console.warn(
      'Remote debugger is in a background tab which may cause apps to ' +
      'perform slowly. Fix this by foregrounding the tab (or opening it in ' +
      'a separate window).'
    );
  };
})();

如您所见，没有使用任何配置选项，整个过程在本地范围内（有关更多详细信息，请参见上面的repo链接）。

大约一周前，我也遇到了同样的问题，最后我找到了对我有效的解决方案

它reactotron叫，你可以在这里找到- https://github.com/reactotron/reactotron，你可以用它来：
*查看应用程序状态
*显示API请求和响应
*进行快速的性能基准
*订阅的部分你应用程序状态
*显示类似于console.log的消息
*使用源映射堆栈跟踪（包括传奇堆栈跟踪）跟踪全局错误！
*调度诸如政府运行的精神控制实验之类的动作
*热插拔应用程序的状态
*跟踪您的骚扰

希望我的帖子对您​​有所帮助，并且您永远不会面对这个乏味的警告。

祝好运

我用这个 index.js

if (__DEV__) {
  console.ignoredYellowBox = [
    'Remote debugger',
    'Warning: isMounted… is deprecated',
    'Module RCTImageLoader'
  ];
}

我已最小化“ http：// localhost：8081 / debugger-ui / ”窗口。只需将其打开（最小化），然后重新加载该应用程序即可删除警告。

可能有另一个调试器已经连接到打包程序。因此，请关闭您的终端机和调试器Google Chrome。

如果您使用Visual Studio的软件包管理器，请不要通过Mac /其他os终端命令启动软件包管理器。

因此，请关闭所有终端并停止使用软件包管理器和Google chrome调试器。重新开始该过程。