Как скрыть предупреждения в симуляторе React Native iOS?

Я только что обновил свой React Native, и теперь в симуляторе iOS появилось несколько предупреждений. Как, помимо их исправления, скрыть эти предупреждения, чтобы видеть, что под ними?

Согласно Реагировать Native документации , вы можете скрыть предупреждающие сообщения, установив , disableYellowBoxчтобы , trueкак это:

console.disableYellowBox = true;

Обновить

~~ console.disableYellowBox ~~ удален, и теперь вы можете использовать:

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

игнорировать все уведомления журнала

Лучший способ выборочно скрыть определенные предупреждения (которые появляются на неопределенное время после обновления до последней и самой лучшей версии RN) - это установить console.ignoredYellowBox в общем файле JS в вашем проекте. Например, после обновления моего проекта до RN 0.25.1 я видел много ...

Предупреждение: ReactNative.createElement устарел ...

Я все еще хочу видеть полезные предупреждения и сообщения об ошибках от React-Native, но я хочу подавить это конкретное предупреждение, потому что оно исходит из внешней библиотеки 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'];

Таким образом, я все еще получаю другие ошибки и предупреждения, полезные для моей среды разработки, но я больше не вижу эту конкретную.

Чтобы отключить желтое поле, поместите

console.disableYellowBox = true; 

в любом месте вашего приложения. Обычно в корневом файле, поэтому он применяется как к iOS, так и к Android.

Например

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;

например: - в файле index.js

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;

В вашем файле app.js в любом методе жизненного цикла компонента. Как и в componentDidmount (), вы должны добавить оба из них, исключение любого из них не будет работать.

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

Добавьте следующий код в свой файл index.js

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

Если вы пытаетесь быстро продемонстрировать приложение.

Если вы хотите скрыть их в конкретной сборке, потому что вы делаете демонстрацию или что-то в этом роде, вы можете отредактировать свою схему Xcode, чтобы сделать ее сборкой выпуска, и эти желтые предупреждения не будут отображаться. Кроме того, ваше приложение будет работать намного быстрее.

Вы можете отредактировать схему для вашего симулятора и реального устройства, выполнив следующие действия:

1. В проекте в XCode.
2. Product> Scheme>Edit Scheme...
3. Измените Build Configurationс Debugна Release.

Для тех, кто идет этим путем, пытаясь отключить красные предупреждения с консоли, которые дают абсолютно бесполезную информацию, по состоянию на 17 февраля вы можете добавить эту строку кода где-нибудь

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

Отключает все console.error

console.disableYellowBox = true;

это сработало для уровня приложения. Поместите его в любом месте файла index.js.

Чтобы отключить желтый квадрат, поместите его в console.disableYellowBox = true;любом месте вашего приложения. Обычно в корневом файле, поэтому он применяется как к iOS, так и к Android.

Для получения более подробной информации, пожалуйста, проверьте официальный документ

console.disableYellowBox = true;

console.ignoredYellowBox = ['Предупреждение: каждый', 'Предупреждение: сбой'];

Я обнаружил, что даже когда я отключил определенные предупреждения (сообщения желтого ящика) с помощью вышеупомянутых методов, предупреждения были отключены на моем мобильном устройстве, но они все еще регистрировались на моей консоли, что очень раздражало и отвлекало.

Чтобы предупреждения не записывались в консоль, вы можете просто переопределить warnметод consoleобъекта.

// 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 Native.

Кроме того, я считаю, что React Native использует этот console.errorметод для регистрации ошибок (сообщений красного ящика), поэтому я предполагаю, что этот метод также можно использовать для фильтрации конкретных ошибок.

Я рекомендую небольшой инструмент, разработанный нашей командой, он собирает все предупреждения и ошибки в значок с плавающей точкой. Сравните console.disableYellowBox = true;, вы все еще можете увидеть, где находится предупреждение или ошибка, но это вас не беспокоит. WT-консоль Github Repo: https://github.com/WeBankFinTech/wt-console

В файле AppDelegate.m вы можете изменить эту строку:

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

и заменить dev=trueна dev=falseконце.

Связано: Подавить предупреждения Xcode из библиотеки React Native

(но не для вашего собственного кода)

почему: при инициализации нового RN-приложения проект Xcode содержит около 100 предупреждений, которые отвлекают шум (но в противном случае, вероятно, безвредны)

Решение: установите для параметра « Запретить все предупреждения» значение « Да» в разделе « Параметры сборки» для соответствующих целей.

Отключить предупреждения в Xcode из фреймворков

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