Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

People also ask

What is LogBox in React Native?

LogBox is a completely redesigned redbox, yellowbox, and logging experience in React Native. In 0.62 we introduced LogBox as an opt-in. In this release, we're launching LogBox as the default experience in all of React Native.

How run React Native command line IOS simulator?

If you wish to run your app on an iPhone SE (2nd generation), run npx react-native run-ios --simulator="iPhone SE (2nd generation)" . The device names correspond to the list of devices available in Xcode. You can check your available devices by running xcrun simctl list devices from the console.


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


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.


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

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;