@hramos I tried doing the same, but apparently, LogBox isn’t exported yet, if I try to import it import { LogBox } from 'react-native' it comes back undefined. Or should I create a separate issue for that?

Temporary solution.

ignoreWarnings.js

import { LogBox } from "react-native";

if (__DEV__) {
  const ignoreWarns = [
    "EventEmitter.removeListener",
    "[fuego-swr-keys-from-collection-path]",
    "Setting a timer for a long period of time",
    "ViewPropTypes will be removed from React Native",
    "AsyncStorage has been extracted from react-native",
    "exported from 'deprecated-react-native-prop-types'.",
    "Non-serializable values were found in the navigation state.",
    "VirtualizedLists should never be nested inside plain ScrollViews",
  ];

  const warn = console.warn;
  console.warn = (...arg) => {
    for (const warning of ignoreWarns) {
      if (arg[0].startsWith(warning)) {
        return;
      }
    }
    warn(...arg);
  };

  LogBox.ignoreLogs(ignoreWarns);
}

App.js

// import at the very top of everything.
import "../ignoreWarnings";

But LogBox.ignoreLogs([“pattern to ignore”]) doesn’t work. @rickhanlonii

x2

You even not reviewed this thread. Just closed it. 😱

LogBox.ignoreLogs is not working

But LogBox.ignoreLogs(["pattern to ignore"]) doesn’t work. @rickhanlonii

Here is a temporary workaround in case someone needs:

import { YellowBox } from "react-native";
YellowBox.ignoreWarnings([""]);

That disables all warnings that start with an empty string, in other words, all warnings. This works even if unstable_enableLogBox is set.

Sad that the actual LogBox doesn’t work correctly and we have to hack it through!

This error is shown in console, even with ignoreLogs specific, global, etc. even with ignoreAllLogs(true)

VirtualizedLists should never be nested inside plain ScrollViews

import {LogBox} from 'react-native'
LogBox.ignoreAllLogs(true)

Does not work for me on 0.63.2 The import does not work.

Recommended Solution

LogBox added two new methods for controlling logs:

• LogBox.ignoreLogs(["pattern to ignore"]): Use this when you want to ignore a specific list of warnings (such as when a library is causing a warning that you cannot fix). It is not recommended to use this for warnings that you do have control of fixing.
• LogBox.ignoreAllLogs(): Replaces console.disableYellowBox. Use this to temporarily disable all warnings in development. It is not recommended to check this in as it will disable warnings for your entire app.

Also, many of the the warnings in the above Temporary Solution from @SohelIslamImran should not be ignored. These warnings include deprecation warnings which should be fixed so that your code is ready to upgrade to a future versions that removes the deprecations. Ignoring these warnings will result in your code throwing later.

Temporary solution.

ignoreWarnings.js

import { LogBox } from "react-native";

if (__DEV__) {
  const ignoreWarns = [
    "EventEmitter.removeListener",
    "[fuego-swr-keys-from-collection-path]",
    "Setting a timer for a long period of time",
    "ViewPropTypes will be removed from React Native",
    "AsyncStorage has been extracted from react-native",
    "exported from 'deprecated-react-native-prop-types'.",
    "Non-serializable values were found in the navigation state.",
    "VirtualizedLists should never be nested inside plain ScrollViews",
  ];

  const warn = console.warn;
  console.warn = (...arg) => {
    for (const warning of ignoreWarns) {
      if (arg[0].startsWith(warning)) {
        return;
      }
    }
    warn(...arg);
  };

  LogBox.ignoreLogs(ignoreWarns);
}

App.js

// import at the very top of everything.
import "../ignoreWarnings";

This worked for me, you’re a legend for this

anyway to disable specific log like RCTBridge required dispatch_sync … ?

Here is an example of how to ignore warning “Non-serializable values were found in the navigation state”:

LogBox.ignoreLogs([
  "Non-serializable values were found in the navigation state", 
  // name of the error/warning here, or a regex here
]);

ReactNative.LogBox.ignoreAllLogs(true); In React-Native 0.63, this will prevent annoying yellow warning box in screen. You can add above line in root app function.

Can confirm that this works on 0.63^

import {LogBox} from 'react-native'
LogBox.ignoreAllLogs(true)

@nicoburns ~Yh currently using 0.63.1 and trying to ignore/disable some warnings but can’t seem to import them~ Oops my bad, had the wrong version of the type definition installed 🤦

Temporary solution.

ignoreWarnings.js

import { LogBox } from "react-native";

if (__DEV__) {
  const ignoreWarns = [
    "EventEmitter.removeListener",
    "[fuego-swr-keys-from-collection-path]",
    "Setting a timer for a long period of time",
    "ViewPropTypes will be removed from React Native",
    "AsyncStorage has been extracted from react-native",
    "exported from 'deprecated-react-native-prop-types'.",
    "Non-serializable values were found in the navigation state.",
    "VirtualizedLists should never be nested inside plain ScrollViews",
  ];

  const warn = console.warn;
  console.warn = (...arg) => {
    for (const warning of ignoreWarns) {
      if (arg[0].startsWith(warning)) {
        return;
      }
    }
    warn(...arg);
  };

  LogBox.ignoreLogs(ignoreWarns);
}

App.js

// import at the very top of everything.
import "../ignoreWarnings";

This issue needs to be reopened, but as of now, this is seems to be the valid solution.

Calling LogBox.ignoreAllLogs(), LogBox.ignoreAllLogs(true), and LogBox.ignoreLogs('') doesn’t seem to work in react-native 0.64.3. I tried making the calls globally at the entry of my app code.

I’ll go back to replacing console.warn for now.

I suspect it’s not working, since hermes doesn’t allow to monkey-patch console. This temporary didn’t work for me neither.

Guys, be careful where the error occurs, more precisely in which screen because the warning may appear after you have ignored it.

I don’t understand why it’s not global, but for me that was the problem.

ReactNative.LogBox.ignoreAllLogs(true); In React-Native 0.63, this will prevent annoying yellow warning box in screen. You can add above line in root app function.

import { LogBox } from "react-native";

if (__DEV__) {
  const ignoreWarns = [
    "EventEmitter.removeListener",
    "[fuego-swr-keys-from-collection-path]",
    "Setting a timer for a long period of time",
    "ViewPropTypes will be removed from React Native",
    "AsyncStorage has been extracted from react-native",
    "exported from 'deprecated-react-native-prop-types'.",
    "Non-serializable values were found in the navigation state.",
    "VirtualizedLists should never be nested inside plain ScrollViews",
  ];

  const warn = console.warn;
  console.warn = (...arg) => {
    for (const warning of ignoreWarns) {
      if (arg[0].startsWith(warning)) {
        return;
      }
    }
    warn(...arg);
  };

  LogBox.ignoreLogs(ignoreWarns);
}

This is working for me. Well done

@kingdomstrategies I’m using ClojureScript but you can probably understand what I did even if you aren’t familiar with ClojureScript.

(defonce warn js/console.warn)
(set! js/console.warn
      (fn [& args]
        (when-not (str/includes? (first args) "React Components must start with an uppercase letter.")
          (apply warn args))))

Basically, create a new variable and assign console.warn to it to store the original function, then redefine console.warn to a new function that only delegates to console.warn if the message isn’t one you want to filter out.

Let me know if you need more help with a pure JS/TS solution.

Thank you very much for this suggestion. Worked right way.

IgnoreLogs is still not working in my cljs react native app with react native version 0.71.2

LogBox.ignoreLogs is not working

@kingdomstrategies I’m using ClojureScript but you can probably understand what I did even if you aren’t familiar with ClojureScript.

(defonce warn js/console.warn)
(set! js/console.warn
      (fn [& args]
        (when-not (str/includes? (first args) "React Components must start with an uppercase letter.")
          (apply warn args))))

Basically, create a new variable and assign console.warn to it to store the original function, then redefine console.warn to a new function that only delegates to console.warn if the message isn’t one you want to filter out.

Let me know if you need more help with a pure JS/TS solution.

@bpringe How did you replace console.warn? I have tons of useless warnings being logged to my console regarding packages I have no control over and it’s making it impossible to debug usefully using the console.

For some reason YellowBox.ignoreWarnings(['']); completely turns off my error box, when I raise an exception I see a white screen, if I uncomment this line, the error is shown with the new log box as expected.