如何在 React Native iOS 模拟器中隐藏警告？

Posted 2023-02-24

【中文标题】如何在 React Native iOS 模拟器中隐藏警告？

【英文标题】：How do you hide the warnings in React Native iOS simulator?

【发布时间】：2016-05-20 11:04:31

【问题描述】：

我刚刚升级了我的 React Native，现在 ios 模拟器有一堆警告。除了修复它们，我如何隐藏这些警告以便我可以看到下面的内容？

【参考方案1】：

在您的 AppDelegate.m 文件中，您可以更改这一行：

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

最后用dev=false替换dev=true。

【参考方案2】：

如果您想快速演示应用程序。

如果您想在特定构建中隐藏它们，因为您正在进行演示或其他操作，您可以编辑您的 Xcode 方案以使其成为发布构建，这些黄色警告将不会出现。此外，您的应用会运行得更快。

您可以通过执行以下操作为您的模拟器和真实设备编辑方案：

在 XCode 的项目中。 Product > Scheme > Edit Scheme... 将 Build Configuration 从 Debug 更改为 Release。

【讨论】：

应该是公认的答案。在Release：没有警告，更快的应用程序！

Release 没有任何调试功能

@PhilAndrews 我同意！我不知道我何时以这种方式发布过，但有足够多的人觉得它有用，我会离开它。我一定一直在尝试向某人演示该应用程序并希望摆脱黄色警告，在这种情况下，这是正确的方法。

【参考方案3】：

有选择地隐藏某些警告（在升级到最新和最好的 RN 版本后无限期显示）的更好方法是在项目的公共 JS 文件中设置 console.ignoredYellowBox。例如，今天将我的项目升级到 RN 0.25.1 后，我看到了很多...

警告：ReactNative.createElement 已弃用...

我仍然希望能够看到来自 React-Native 的有用警告和错误消息，但我想消除这个特定的警告，因为它来自尚未包含 RN 0.25 中的重大更改的外部 npm 库。所以在我的 App.js 中我添加了这一行...

// RN >= 0.63
import  LogBox  from 'react-native';

LogBox.ignoreLogs(['Warning: ...']);

// RN >= 0.52
import YellowBox from 'react-native';

YellowBox.ignoreWarnings(['Warning: ReactNative.createElement']);

// RN < 0.52
console.ignoredYellowBox = ['Warning: ReactNative.createElement'];

这样我仍然会收到对我的开发环境有帮助的其他错误和警告，但我不再看到那个特定的错误和警告。

【讨论】：

对我来说是完美的修复，虽然我有相同的“ReactNative.createElement 已弃用”警告。

你应该写多少错误信息来忽略它？

这个答案需要更新。 YelloBox 不再是 react-native 的一部分。

它同时支持正则表达式和子字符串，但打字稿类型只有字符串:(

【参考方案4】：

根据 React Native Documentation，您可以通过将 disableYellowBox 设置为 true 来隐藏警告消息，如下所示：

console.disableYellowBox = true;

更新：React Native 0.63+

console.disableYellowBox 已删除，现在您可以使用：

import  LogBox  from 'react-native';
LogBox.ignoreLogs(['Warning: ...']); // Ignore log notification by message
LogBox.ignoreAllLogs();//Ignore all log notifications

忽略所有日志通知

【讨论】：

这对我有用，但不是其他答案说 console.ignoredYellowBox = [...];

谢谢！这应该是选定的答案。

@Mike，脚本中的任何位置，当您想禁用黄色框时。

一个好地方放在RootContainer组件的构造函数上！

将它放在App.js（或Routes.js，具体取决于您的结构）也很有效。

【参考方案5】：

对于那些试图从控制台禁用红色警告的人，截至 2 月 17 日，这提供绝对无用的信息，您可以在某处添加这行代码

console.error = (error) => error.apply;

禁用所有console.error

【讨论】：

谢谢！我什至没有意识到我的控制台错误是弹出红屏的原因。我认为 try/catch 不工作有问题：o.

【参考方案6】：

相关：抑​​制来自 React Native 库的 Xcode 警告

（但不适用于您自己的代码）

为什么：在初始化一个新的 RN 应用程序时，Xcode 项目包含接近 100 个警告，这些警告会分散噪音（但可能无害）

解决方案：在相关目标的Build Settings下将inhibit all warnings设置为yes。

Disable warnings in Xcode from frameworks

https://github.com/facebook/react-native/issues/11736

【讨论】：

也;逻辑错误；请参阅“-Xanalyzer -analyzer-disable-all-checks”

最初的问题是关于应用内警告（即黄色框），我在尝试清理 Xcode 项目警告时发现了这个问题。为什么要投反对票？见meta.***.com/questions/299352/…

【参考方案7】：

要禁用黄框的地方

console.disableYellowBox = true; 

在您的应用程序中的任何位置。通常在根文件中，因此它适用于 iOS 和 android。

例如

export default class App extends React.Component 
     render() 
          console.disableYellowBox = true;
          return (<View></View>);
     

【参考方案8】：

要禁用黄色框，请将console.disableYellowBox = true; 放置在应用程序的任何位置。通常在根文件中，因此它适用于 iOS 和 Android。

更多详情请查看official document

【参考方案9】：

在您的 index.js 文件中添加以下代码

console.disableYellowBox = true;

    import AppRegistry from 'react-native';
    import App from './App';
    import name as appName from './app.json';

    console.disableYellowBox = true;



AppRegistry.registerComponent(appName, () => App);

【参考方案10】：

console.disableYellowBox = true;

这适用于应用程序级别将它放在 index.js 文件中的任何位置

【参考方案11】：

在任何组件的生命周期方法下的 app.js 文件中。就像在 componentDidmount() 中 你必须添加这两个，排除任何都行不通。

console.ignoredYellowBox = ['Warning: Each', 'Warning: Failed'];
console.disableYellowBox = true;

【讨论】：

这不是真的，您的项目中发生了一些事情。一行说“忽略此警告列表”（这是最精确的方法），一行说“忽略所有警告”（这是一种非常生硬的方法）。例如，我只有第一行，它完美地抑制了我的警告。

【参考方案12】：

console.ignoredYellowBox = ['警告：每个'，'警告：失败'];

【参考方案13】：

console.disableYellowBox = true;

【参考方案14】：

add this line in your app main screen.

console.disableYellowBox = true;

例如：- 在 index.js 文件中

import  AppRegistry  from 'react-native';
import './src/utils';
import App from './App';
import  name as appName  from './app.json';

AppRegistry.registerComponent(appName, () => App);
console.disableYellowBox = true;

【参考方案15】：

我发现，即使我使用上述方法禁用了特定警告（黄框消息），警告在我的移动设备上被禁用，但它们仍被记录到我的控制台，这非常烦人和分散注意力。

为了防止警告被记录到您的控制台，您可以简单地覆盖 console 对象上的 warn 方法。

// This will prevent all warnings from being logged
console.warn = () => ;

甚至可以通过测试提供的消息来仅禁用特定警告：

// Hold a reference to the original function so that it can be called later
const originalWarn = console.warn;

console.warn = (message, ...optionalParams) => 
  // Insure that we don't try to perform any string-only operations on
  // a non-string type:
  if (typeof message === 'string') 
    // Check if the message contains the blacklisted substring
    if (/Your blacklisted substring goes here/g.test(message))
    
      // Don't log the value
      return;
    
  

  // Otherwise delegate to the original 'console.warn' function
  originalWarn(message, ...optionalParams);
;

如果您不能（或不想）使用正则表达式来测试字符串，indexOf 方法也可以工作：

// An index of -1 will be returned if the blacklisted substring was NOT found
if (message.indexOf('Your blacklisted substring goes here') > -1) 
  // Don't log the message
  return;

请注意，此技术将过滤通过warn 函数的所有 消息，无论它们来自何处。 因此，请注意不要指定过于宽泛的黑名单，以抑制可能源自 React Native 以外的其他地方的其他有意义的错误。

另外，我相信 React Native 使用 console.error 方法来记录错误（红框消息），所以我假设这种技术也可以用来过滤掉特定的错误。

【参考方案16】：

RN >= 0.62

import LogBox from 'react-native'

在import下，添加

LogBox.ignoreLogs(['...']);

而不是'...'， 您可以编写要隐藏的警告。 例如， 我有警告 VirtualizedLists 永远不应该...... 那么我可以写成

LogBox.ignoreLogs(['VirtualizedLists']);

如果你想添加另一个错误，你可以写成

LogBox.ignoreLogs(['VirtualizedLists','Warning:...']);

【参考方案17】：

对我来说，目前我使用的是 react native 0.64

  import  LogBox  from 'react-native';

  LogBox.ignoreLogs(['Warning: ...']); //Hide warnings

  LogBox.ignoreAllLogs();//Hide all warning notifications on front-end

添加警告以准确指定要抑制的警告时，您需要准确地添加警告消息，如下所示（随机示例）

LogBox.ignoreLogs([
  'Warning: Failed prop type: Invalid props.style key `tintColor` supplied to `Text`.',
]);

例如，在tintColor 或Text 周围使用单引号而不是反引号是行不通的。

【参考方案18】：

我喜欢将 console.disableYellowBox = true 放在文件根目录下，例如 App. 但这只是在我处于开发阶段时。