Skip to main content
LogBox is a development tool that displays logs in your app during development. It replaces the older YellowBox and RedBox error screens.
LogBox is only active in development mode (__DEV__ === true). In production builds, all LogBox methods are no-ops.

​
Methods

​
install()

static install(): void
Installs LogBox to intercept console warnings and errors. This is automatically called when you import React Native, but you can manually call it if needed. Example: 
import { LogBox } from 'react-native';

LogBox.install();

​
uninstall()

static uninstall(): void
Uninstalls LogBox and restores the original console methods. Example: 
import { LogBox } from 'react-native';

LogBox.uninstall();

​
isInstalled()

static isInstalled(): boolean
Returns whether LogBox is currently installed. Returns:
  • true if LogBox is installed, false otherwise
Example: 
import { LogBox } from 'react-native';

if (LogBox.isInstalled()) {
  console.log('LogBox is active');
}

​
ignoreLogs()

static ignoreLogs(patterns: ReadonlyArray<string | RegExp>): void
Silences any logs that match the given strings or regular expressions. Parameters:
  • patterns: Array of strings or RegExp patterns to ignore
Example: 
import { LogBox } from 'react-native';

// Ignore specific warning messages
LogBox.ignoreLogs([
  'Warning: componentWillReceiveProps',
  'Setting a timer',
]);

// Ignore using regex
LogBox.ignoreLogs([
  /ViewPropTypes will be removed/,
  /Animated: `useNativeDriver`/,
]);
Common Use Case: 
import { LogBox } from 'react-native';

// Ignore all warnings from a specific library
LogBox.ignoreLogs([
  'VirtualizedLists should never be nested',
]);

​
ignoreAllLogs()

static ignoreAllLogs(value?: boolean): void
Toggles error and warning notifications. Note: this only disables notifications; uncaught errors will still open a full-screen LogBox. Parameters:
  • value: Whether to ignore all logs (defaults to true if not provided)
Example: 
import { LogBox } from 'react-native';

// Disable all LogBox notifications
LogBox.ignoreAllLogs();

// Or explicitly
LogBox.ignoreAllLogs(true);

// Re-enable notifications
LogBox.ignoreAllLogs(false);
Use Case - Screenshot Testing: 
import { LogBox } from 'react-native';

// Disable LogBox during screenshot tests
if (process.env.SCREENSHOT_MODE) {
  LogBox.ignoreAllLogs();
}

​
clearAllLogs()

static clearAllLogs(): void
Clears all logs currently displayed in LogBox. Example: 
import { LogBox } from 'react-native';

LogBox.clearAllLogs();

​
addLog()

static addLog(log: LogData): void
Manually adds a log to LogBox. Generally not needed unless you’re building custom logging tools. Parameters:
  • log: Log data object containing:
    • level: 'warn' | 'error' | 'fatal'
    • message: Message object with content string
    • category: String category for grouping
    • componentStack: Stack trace array
Example: 
import { LogBox } from 'react-native';

LogBox.addLog({
  level: 'warn',
  message: {
    content: 'This is a custom warning',
    substitutions: [],
  },
  category: 'CustomWarning',
  componentStack: [],
});

​
addException()

static addException(error: ExtendedExceptionData): void
Adds an exception to LogBox. Used internally by the error handling system. Parameters:
  • error: Extended exception data object

​
Common Patterns

​
Ignore Known Third-Party Warnings

import { LogBox } from 'react-native';

// In your app's entry file (index.js or App.js)
LogBox.ignoreLogs([
  // Ignore warnings from react-native-gesture-handler
  'RCTBridge required dispatch_sync',
  
  // Ignore warnings from deprecated lifecycle methods
  'Warning: componentWillMount',
  'Warning: componentWillReceiveProps',
  
  // Ignore timer warnings during navigation
  'Setting a timer for a long period of time',
]);

​
Conditional LogBox Configuration

import { LogBox } from 'react-native';

if (__DEV__) {
  // Ignore warnings only in development
  LogBox.ignoreLogs([
    'Non-serializable values were found in the navigation state',
  ]);
  
  // Disable all logs for specific testing scenarios
  if (process.env.E2E_TEST) {
    LogBox.ignoreAllLogs(true);
  }
}

​
Clear Logs Programmatically

import { LogBox, Button } from 'react-native';

function DebugPanel() {
  return (
    <Button
      title="Clear LogBox"
      onPress={() => LogBox.clearAllLogs()}
    />
  );
}

​
Project Setup Example

// index.js
import { AppRegistry, LogBox } from 'react-native';
import App from './App';
import { name as appName } from './app.json';

// Configure LogBox before registering the app
if (__DEV__) {
  LogBox.ignoreLogs([
    // Add your ignored warnings here
    'VirtualizedLists should never be nested',
    'Require cycle:',
  ]);
}

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

​
Development vs Production

Development (__DEV__ === true):
  • LogBox intercepts console.warn() and console.error()
  • Shows warnings and errors in an overlay
  • Allows ignoring specific messages
Production (__DEV__ === false):
  • All LogBox methods become no-ops
  • No overlays are shown
  • Console methods work normally
  • No performance impact

​
Best Practices

  1. Don’t Ignore Everything: Use ignoreLogs() sparingly and only for known, unavoidable warnings
  2. Use Specific Patterns: Prefer specific strings over broad regex patterns to avoid hiding important warnings 
    // Good - specific
LogBox.ignoreLogs(['Specific warning message']);

// Bad - too broad
LogBox.ignoreLogs([/Warning/]);
  3. Document Ignored Warnings: Add comments explaining why each warning is ignored 
    LogBox.ignoreLogs([
  // TODO: Remove when react-native-library updates to new API
  'Warning: componentWillReceiveProps',
]);
  4. Temporary Ignores: Review ignored warnings periodically and remove them when the underlying issues are fixed
  5. Team Communication: Keep ignored warnings in version control so the whole team is aware

​
Migration from YellowBox

If you’re migrating from the old YellowBox: 
// Old YellowBox API
import { YellowBox } from 'react-native';
YellowBox.ignoreWarnings(['Warning...']);

// New LogBox API
import { LogBox } from 'react-native';
LogBox.ignoreLogs(['Warning...']);

Build docs developers (and LLMs) love

Get started for freeTalk to us