How do you hide the warnings in React Native iOS simulator?

Solution 1:

According to React Native Documentation, you can hide warning messages by setting disableYellowBox to true like this:

console.disableYellowBox = true;

Update: React Native 0.63+

console.disableYellowBox is removed and now you can use:

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

to ignore all log notifications

Solution 2:

A better way to selectively hide certain warnings (that indefinitely show up after an upgrade to the latest and greatest RN version) is to set console.ignoredYellowBox in a common JS file in your project. For example, after upgrading my project today to RN 0.25.1 I was seeing a lot of...

Warning: ReactNative.createElement is deprecated...

I still want to be able to see helpful warnings and error messages from React-Native, but I want to squash this particular warning because it's coming from an external npm library that hasn't yet incorporated the breaking changes in RN 0.25. So in my App.js I add this line...

// 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'];

This way I still get other errors and warning helpful for my dev environment, but I no longer see that particular one.

Solution 3:

To disable the yellow box place

console.disableYellowBox = true;

anywhere in your application. Typically in the root file so it will apply to both iOS and Android.

For example

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

Solution 4:

add this line in your app main screen.

console.disableYellowBox = true;

for example:- 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;

Solution 5:

In your app.js file under any component's lifecycle method.like in componentDidmount() you have to add both of these,excluding any will not work.

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