如何在 ReactNativeiOS 模拟器中隐藏警告?

我刚刚升级了我的本机反应,现在 iOS 模拟器有一堆警告。除了修复它们之外,我如何隐藏这些警告以便看到底下是什么?

176291 次浏览

应用代表文件中,您可以更改以下行:

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

最后用 dev=false代替 dev=true

如果你正在尝试 快点演示应用程序。

如果因为要进行演示或其他操作而希望将它们隐藏在特定的构建中,则可以编辑 Xcode 方案,使其成为发布版本,这些黄色警告将不会显示。此外,您的应用程序将运行得更快。

您可以通过执行以下操作来编辑模拟器和实际设备的 Scheme:

  1. 在 XCode 中的 Project 中。
  2. Product > Scheme > Edit Scheme...
  3. Build ConfigurationDebug改为 Release

有选择地隐藏某些警告(在升级到最新最好的 RN 版本之后无限期显示)的更好方法是在项目中的公共 JS 文件中设置 控制台,忽略 YellowBox。例如,在今天将我的项目升级到 RN 0.25.1之后,我看到了很多..。

警告: ReactNative.createElement 已被弃用..。

我仍然希望能够看到有用的警告和错误消息从反应原生,但我想压制这个特定的警告,因为它是来自一个外部 npm 库,尚未纳入 RN 0.25的破坏性变化。所以在我的 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'];

通过这种方式,我仍然可以得到对我的开发环境有帮助的其他错误和警告,但是我不再看到那个特定的错误。

根据 React Native文件,您可以通过将 disableYellowBox设置为 true来隐藏警告消息,如下所示:

console.disableYellowBox = true;

更新: React Native0.63 +

console.disableYellowBox被删除,现在你可以使用:

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

忽略所有日志通知

对于那些试图从控制台中禁用红色警告的人来说,这些警告提供了绝对无用的信息,从2月17日开始,您可以在某个地方添加这行代码

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

禁用所有 console.error

相关内容: 取消 React 本机库中的 Xcode 警告

(但不适用于您自己的代码)

为什么: 在初始化一个新的 RN-app 时,Xcode 项目包含近100个会分散注意力的警告(否则可能是无害的)

解决方案: 对于相关目标,将 生成设置下的 抑制所有警告设置为 是的

enter image description here

在 Xcode 禁用来自框架的警告

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

关闭黄色盒子的地方

console.disableYellowBox = true;

在你的应用程序的任何地方。通常在根文件,所以它将适用于 iOS 和 Android。

比如说

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

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

欲了解更多细节,请检查 正式文件

Index.js文件中添加以下代码

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);

DisableYellowBox = true;

把它放在 index.js 文件的任何地方

在任何组件的生命周期 method.like 中的 app.js 文件中 你必须把这两个都加进去,不包括任何一个都行不通。

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

IgnredYellowBox = [“警告: 每个”,“警告: 失败”] ;

DisableYellowBox = true;

add this line in your app main screen.

DisableYellowBox = true;

例如:-in index.js file

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;

我发现,即使我使用上述方法禁用了特定的警告(黄框消息) ,我的移动设备上禁用的警告 曾经是,但它们仍然被记录到我的控制台,这是非常恼人和分散注意力。

要防止将警告记录到控制台,只需重写 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 Nativeuse 使用 console.error方法来记录错误(红盒子消息) ,所以我假设这种技术也可以用来过滤出特定的错误。

RN > = 0.62

import {LogBox} from 'react-native'

在导入项下,添加

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

而不是.., 您可以编写要隐藏的警告。 比如说, 我得到警告,虚拟列表不应该..。 那我就可以写成

LogBox.ignoreLogs(['VirtualizedLists']);

如果要添加其他错误,可以编写为

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

对于我来说,以下行目前工作,我正在使用反应原生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`.',
]);

例如,在 tintColorText周围使用单引号而不是反勾是不起作用的。

我喜欢把 console. disableYellowBox = true 放在文件根目录下,就像 App 一样。 但这只是我在发展阶段。

Error = (error) = > error.application;//in the index.js

有时候 rn0.66不能在 Logbox 中工作,尤其是对于 VirtualizedList,不应该将其嵌套在普通的 ScrollView 中。

并且忽略红色警告。

添加 app.js

从 React 本机导入 LogBox

从“反应原生”导入{ LogBox } ;

然后..。

IgnreAllLogs ()