Jak ukryć ostrzeżenia w symulatorze React Native iOS?

107

Właśnie zaktualizowałem moją React Native i teraz symulator iOS ma kilka ostrzeżeń. Oprócz ich naprawiania, jak mogę ukryć te ostrzeżenia, aby zobaczyć, co jest pod spodem?

Jakiś facet
źródło

Odpowiedzi:

208

Według React Native Documentation , możesz ukryć komunikaty ostrzegawcze, ustawiając disableYellowBoxw trueten sposób:

console.disableYellowBox = true;
Moussawi7
źródło
3
to działało dla mnie, ale nie inne odpowiedzi, które mówiły console.ignoredYellowBox = [...];
sdfsdf
6
Dziękuję Ci! To powinna być wybrana odpowiedź.
Sreejith Ramakrishnan
1
Przepraszam, ale gdzie dodajesz console.disableYellowBox = true?
Michel Arteta
2
@Mike, w dowolnym miejscu skryptu, gdy chcesz wyłączyć żółte pole.
Moussawi7
2
Dobrym miejscem do umieszczenia go jest konstruktor komponentu RootContainer!
Fernando Vieira
102

Lepszym sposobem wybiórczego ukrycia niektórych ostrzeżeń (które pojawiają się na czas nieokreślony po aktualizacji do najnowszej i najlepszej wersji RN) jest ustawienie console.ignoredYellowBox we wspólnym pliku JS w twoim projekcie. Na przykład po dzisiejszej aktualizacji mojego projektu do RN 0.25.1 widziałem wiele ...

Ostrzeżenie: ReactNative.createElement jest przestarzały ...

Nadal chcę widzieć pomocne ostrzeżenia i komunikaty o błędach od React-Native, ale chcę zmiażdżyć to szczególne ostrzeżenie, ponieważ pochodzi z zewnętrznej biblioteki npm, która nie wprowadziła jeszcze przełomowych zmian w RN 0.25. Więc w moim App.js dodaję tę linię ...

// 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'];

W ten sposób nadal otrzymuję inne błędy i ostrzeżenia pomocne w moim środowisku deweloperskim, ale nie widzę już tego konkretnego.

Southerneer
źródło
Idealne rozwiązanie dla mnie, chociaż miałem to samo ostrzeżenie „ReactNative.createElement is deprecated”.
JD Angerhofer
2
jaką część komunikatu o błędzie należy napisać, aby go zignorować?
Soorena
Ta odpowiedź wymaga aktualizacji. YelloBox nie jest już częścią React-Native.
Haidar Zeineddine
17

Aby wyłączyć żółte pole

console.disableYellowBox = true; 

w dowolnym miejscu aplikacji. Zwykle w pliku głównym, więc będzie dotyczył zarówno iOS, jak i Androida.

Na przykład

export default class App extends React.Component {
     render() {
          console.disableYellowBox = true;
          return (<View></View>);
     }
}
Ragulan
źródło
11

W pliku app.js w ramach metody cyklu życia dowolnego komponentu. Podobnie jak w przypadku componentDidmount (), musisz dodać oba te elementy, z wyłączeniem żadnego z nich nie będzie działać.

console.ignoredYellowBox = ['Warning: Each', 'Warning: Failed'];
console.disableYellowBox = true;
Abdul Basit
źródło
To nieprawda, coś się dzieje w Twoim projekcie. Jedna linia mówi „zignoruj ​​tę listę ostrzeżeń” (co jest najbardziej precyzyjnym sposobem na zrobienie tego), druga linia mówi „zignoruj ​​wszystkie ostrzeżenia” (co jest naprawdę prostym sposobem na zrobienie tego). Na przykład mam tylko pierwszą linię, która doskonale tłumi moje ostrzeżenia.
Mike Hardy
11

add this line in your app main screen.

console.disableYellowBox = true;

SaGaR Patel
źródło
9

Dodaj następujący kod w swoim index.js pliku

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);
Sarthak Mishra
źródło
7

Jeśli próbujesz szybko demonstrować aplikację.

Jeśli chcesz ukryć je w konkretnej kompilacji, ponieważ robisz demo lub coś w tym stylu, możesz edytować swój schemat Xcode, aby był kompilacją wydania, a te żółte ostrzeżenia się nie pojawią. Ponadto Twoja aplikacja będzie działać znacznie szybciej.

Możesz edytować schemat swojego symulatora i rzeczywistego urządzenia, wykonując następujące czynności:

  1. W projekcie w XCode.
  2. Product> Scheme>Edit Scheme...
  3. Zmień Build Configurationz Debugna Release.
Joshua Pinter
źródło
1
Powinna być zaakceptowana odpowiedź. In Release: bez ostrzeżenia i szybsza aplikacja!
cappie013
2
Nie masz żadnych funkcji debugowania wRelease
Phil Andrews,
1
@PhilAndrews Zgadzam się! Nie wiem, kiedy to opublikowałem, ale jest wystarczająco dużo osób, które uznają to za przydatne, że zostawię to. Pewnie próbowałem komuś demonstrować aplikację i chciałem pozbyć się żółtych ostrzeżeń. W takim przypadku jest to właściwa droga.
Joshua Pinter
5

Dla tych, którzy przychodzą w ten sposób, próbując wyłączyć czerwone ostrzeżenia z konsoli, które dają absolutnie bezużyteczne informacje, od lutego / 17 możesz dodać gdzieś ten wiersz kodu

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

Wyłącza wszystko console.error

ośmiościan
źródło
1
Dzięki! Nawet nie zdawałem sobie sprawy, że mój błąd konsoli był przyczyną wyskakującego czerwonego ekranu. Myślałem, że coś jest nie tak z niedziałającym trybem try / catch: o.
Nick
5

console.disableYellowBox = true;

to działało na poziomie aplikacji Umieść to w dowolnym miejscu w pliku index.js

James Siva
źródło
4

Aby wyłączyć żółte pole, umieść console.disableYellowBox = true;dowolne miejsce w aplikacji. Zwykle w pliku głównym, więc będzie dotyczył zarówno iOS, jak i Androida.

Aby uzyskać więcej informacji, zapoznaj się z oficjalnym dokumentem

Vivek
źródło
4

console.disableYellowBox = true;

kallayya Hiremath
źródło
1

console.ignoredYellowBox = ['Ostrzeżenie: każde', 'Ostrzeżenie: niepowodzenie'];

Shivo'ham 0
źródło
1

Zauważyłem, że nawet po wyłączeniu określonych ostrzeżeń (komunikatów z żółtą ramką) za pomocą wyżej wymienionych metod, ostrzeżenia były wyłączone na moim urządzeniu mobilnym, ale nadal były rejestrowane na mojej konsoli, co było bardzo denerwujące i rozpraszające.

Aby zapobiec rejestrowaniu ostrzeżeń w konsoli, możesz po prostu nadpisać warnmetodę na consoleobiekcie.

// This will prevent all warnings from being logged
console.warn = () => {};

Możliwe jest nawet wyłączenie tylko określonych ostrzeżeń, testując podany komunikat:

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

Jeśli nie możesz (lub nie chcesz) użyć wyrażenia regularnego do przetestowania ciągu, indexOfmetoda zadziała równie dobrze:

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

Należy pamiętać, że ta technika będzie filtrować wszystkie wiadomości przechodzące przez warnfunkcję, niezależnie od tego, skąd pochodzą. Z tego powodu uważaj, aby nie określić zbyt hojnej czarnej listy, która pomija inne znaczące błędy, które mogą pochodzić z innych źródeł niż React Native.

Uważam również, że React Native używa tej console.errormetody do rejestrowania błędów (wiadomości typu red-box), więc zakładam, że ta technika może być również użyta do odfiltrowania określonych błędów.

Fearnbuster
źródło
1

Polecam małe narzędzie stworzone przez nasz zespół, gromadzi wszystkie ostrzeżenia i błędy w ikonie pływaka. W porównaniu z console.disableYellowBox = true;, nadal możesz zobaczyć, gdzie jest ostrzeżenie lub błąd, ale nie przeszkadza ci to. wprowadź opis obrazu tutaj Repo Github konsoli WT: https://github.com/WeBankFinTech/wt-console

EricHua23
źródło
0

W swoim pliku AppDelegate.m możesz zmienić ten wiersz:

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

i zastąpić dev=trueprzez dev=falsena końcu.

G. Hamaide
źródło
0

Powiązane: Pomiń ostrzeżenia Xcode z biblioteki React Native

(ale nie dla własnego kodu)

dlaczego: podczas inicjowania nowej aplikacji RN projekt Xcode zawiera bliżej 100 ostrzeżeń, które rozpraszają hałas (ale w przeciwnym razie prawdopodobnie nieszkodliwe)

rozwiązanie: ustaw zakaz wszystkich ostrzeżeń na tak w Ustawieniach kompilacji dla odpowiednich celów.

wprowadź opis obrazu tutaj

Wyłącz ostrzeżenia w Xcode z platform

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

Leonard Pauli
źródło
również; dla błędów logicznych; zobacz "-Xanalyzer -analyzer-disable-all -Check"
Leonard Pauli
Pierwotne pytanie dotyczyło ostrzeżenia w aplikacji (tj. Żółte pole). Znalazłem to pytanie podczas próby wyczyszczenia ostrzeżeń projektu Xcode. Dlaczego głosować przeciw? patrz meta.stackoverflow.com/questions/299352/…
Leonard Pauli