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

108

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

Какой-то парень
источник

Ответы:

207

Согласно Реагировать 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

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

Муссави7
источник
3
это сработало для меня, но не другие ответы, в которых говорилось console.ignoredYellowBox = [...];
sdfsdf
6
Спасибо! Это должен быть выбранный ответ.
Сриджит Рамакришнан
1
Извините, но куда добавить console.disableYellowBox = true?
Michel Arteta
2
@Mike, в любом месте вашего скрипта, если вы хотите отключить желтый ящик.
Moussawi7,
2
Его можно разместить в конструкторе компонента RootContainer!
Фернандо Виейра
105

Лучший способ выборочно скрыть определенные предупреждения (которые появляются на неопределенное время после обновления до последней и самой лучшей версии 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'];

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

Южный
источник
Идеальное исправление для меня, хотя у меня было то же предупреждение «ReactNative.createElement устарел».
JD Angerhofer,
2
какую часть сообщения об ошибке вы должны написать, чтобы игнорировать ее?
Soorena
Этот ответ требует обновления. YelloBox больше не является частью react-native.
Haidar Zeineddine,
17

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

console.disableYellowBox = true; 

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

Например

export default class App extends React.Component {
     render() {
          console.disableYellowBox = true;
          return (<View></View>);
     }
}
Рагулан
источник
12

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;
SaGaR Patel
источник
11

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

console.ignoredYellowBox = ['Warning: Each', 'Warning: Failed'];
console.disableYellowBox = true;
Абдул Басит
источник
Это неправда, в вашем проекте что-то происходит. В одной строке написано «игнорировать этот список предупреждений» (что является наиболее точным способом сделать это), в одной строке говорится «игнорировать все предупреждения» (что является действительно грубым способом сделать это). Например, у меня есть только первая строка, и она отлично подавляет мои предупреждения.
Майк Харди,
10

Добавьте следующий код в свой файл 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);
Сартак Мишра
источник
8

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

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

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

  1. В проекте в XCode.
  2. Product> Scheme>Edit Scheme...
  3. Измените Build Configurationс Debugна Release.
Джошуа Пинтер
источник
1
Должен быть принятый ответ. В Release: без предупреждений и более быстрое приложение!
cappie013 04
2
Вы не получаете никаких функций отладки вRelease
Фил Эндрюс
1
@PhilAndrews Я согласен! Я не знаю, когда я это делал, но есть достаточно людей, которые сочтут это полезным, и я оставлю его. Должно быть, я пытался кому-то продемонстрировать приложение и хотел избавиться от желтых предупреждений, и в этом случае это правильный путь.
Джошуа Пинтер
5

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

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

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

октоэдр
источник
1
Спасибо! Я даже не понимал, что ошибка моей консоли была причиной появления красного экрана. Я думал, что что-то не так с неработающим try / catch: o.
Ник
5

console.disableYellowBox = true;

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

Джеймс Шива
источник
4

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

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

Вивек
источник
1

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

Шиво'хам 0
источник
1

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

Чтобы предупреждения не записывались в консоль, вы можете просто переопределить 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метод для регистрации ошибок (сообщений красного ящика), поэтому я предполагаю, что этот метод также можно использовать для фильтрации конкретных ошибок.

Fearnbuster
источник
1

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

EricHua23
источник
0

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

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

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

Г. Хамайде
источник
0

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

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

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

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

введите описание изображения здесь

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

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

Леонард Паули
источник
также; на наличие логических ошибок; см. «-Xanalyzer -analyzer-disable-all-tests»
Леонард Паули
Первоначальный вопрос касался предупреждения в приложении (например, желтого поля), я обнаружил этот вопрос при попытке очистить предупреждения проекта Xcode. Почему голосование против? см. meta.stackoverflow.com/questions/299352/…
Леонард Паули,