Wie können Sie die Warnungen im React Native iOS-Simulator ausblenden?

105

Ich habe gerade mein React Native aktualisiert und jetzt enthält der iOS-Simulator eine Reihe von Warnungen. Wie verstecke ich diese Warnungen, um zu sehen, was sich darunter befindet?

Irgendein Typ
quelle

Antworten:

206

Nach Heimisch in React Dokumentation , können Sie Warnmeldungen verstecken , indem Sie disableYellowBoxzu truewie folgt aus :

console.disableYellowBox = true;
Moussawi7
quelle
3
Dies funktionierte für mich, aber nicht für die anderen Antworten, die console.ignoredYellowBox = [...] sagten.
SDFSDF
5
Danke dir! Dies sollte die ausgewählte Antwort sein.
Sreejith Ramakrishnan
1
Entschuldigung, aber wo fügen Sie console.disableYellowBox = true hinzu?
Michel Arteta
2
@Mike, jeder Ort in Ihrem Skript, an dem Sie das gelbe Kästchen deaktivieren möchten.
Moussawi7
2
Ein guter Ort, um es zu platzieren, ist der Konstruktor der RootContainer-Komponente!
Fernando Vieira
101

Eine bessere Möglichkeit, bestimmte Warnungen (die nach einem Upgrade auf die neueste und beste RN-Version auf unbestimmte Zeit angezeigt werden ) selektiv auszublenden, besteht darin, console.ignoredYellowBox in einer gemeinsamen JS-Datei in Ihrem Projekt festzulegen . Nachdem ich heute mein Projekt auf RN 0.25.1 aktualisiert hatte, sah ich viele ...

Warnung: ReactNative.createElement ist veraltet ...

Ich möchte weiterhin hilfreiche Warnungen und Fehlermeldungen von React-Native sehen können, aber ich möchte diese spezielle Warnung unterdrücken, da sie aus einer externen npm-Bibliothek stammt, die die aktuellen Änderungen in RN 0.25 noch nicht berücksichtigt hat. Also füge ich in meiner App.js diese Zeile hinzu ...

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

Auf diese Weise erhalte ich immer noch andere Fehler und Warnungen, die für meine Entwicklungsumgebung hilfreich sind, aber ich sehe diese nicht mehr.

Südstaatler
quelle
Perfekte Lösung für mich, obwohl ich die gleiche Warnung "ReactNative.createElement ist veraltet" hatte.
JD Angerhofer
2
Wie viel von der Fehlermeldung sollten Sie schreiben, um sie zu ignorieren?
Soorena
Diese Antwort muss aktualisiert werden. YelloBox ist nicht mehr Teil von React-Native.
Haidar Zeineddine
17

So deaktivieren Sie die gelbe Box

console.disableYellowBox = true; 

überall in Ihrer Anwendung. In der Regel in der Stammdatei, sodass sie sowohl für iOS als auch für Android gilt.

Beispielsweise

export default class App extends React.Component {
     render() {
          console.disableYellowBox = true;
          return (<View></View>);
     }
}
Ragulan
quelle
11

In Ihrer app.js-Datei unter der Lebenszyklusmethode einer Komponente müssen Sie wie in componentDidmount () beide hinzufügen, außer dass alle nicht funktionieren.

console.ignoredYellowBox = ['Warning: Each', 'Warning: Failed'];
console.disableYellowBox = true;
Abdul Basit
quelle
Das ist nicht wahr, in Ihrem Projekt ist etwas los. In einer Zeile steht "Ignoriere diese Liste von Warnungen" (was der genaueste Weg ist), in einer Zeile steht "Ignoriere alle Warnungen" (was ein wirklich stumpfer Weg ist). Ich habe zum Beispiel nur die erste Zeile und sie unterdrückt meine Warnungen perfekt.
Mike Hardy
10

add this line in your app main screen.

console.disableYellowBox = true;

SaGaR Patel
quelle
9

Fügen Sie den folgenden Code in Ihre Datei index.js ein

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
quelle
7

Wenn Sie versuchen, die App schnell zu testen.

Wenn Sie sie in einem bestimmten Build ausblenden möchten, weil Sie eine Demo oder etwas anderes ausführen, können Sie Ihr Xcode-Schema so bearbeiten, dass es zu einem Release-Build wird. Diese gelben Warnungen werden nicht angezeigt. Außerdem läuft Ihre App viel schneller.

Sie können das Schema für Ihren Simulator und Ihr reales Gerät wie folgt bearbeiten:

  1. In Projekt in XCode.
  2. Product> Scheme>Edit Scheme...
  3. Wechseln Sie Build Configurationvon Debugzu Release.
Joshua Pinter
quelle
1
Sollte die akzeptierte Antwort sein. In Release: keine Warnung und schnellere App!
cappie013
2
Sie erhalten keine Debug-Funktionen inRelease
Phil Andrews
1
@PhilAndrews Ich stimme zu! Ich weiß nicht, ob ich diesen Weg zurück gepostet habe, aber es gibt genug Leute, die es nützlich finden, dass ich ihn verlasse. Ich muss versucht haben, die App jemandem vorzuführen, und wollte gelbe Warnungen entfernen. In diesem Fall ist dies der richtige Weg.
Joshua Pinter
5

Für diejenigen, die auf diese Weise versuchen, rote Warnungen von der Konsole zu deaktivieren, die ab dem 17. Februar absolut nutzlose Informationen liefern, können Sie diese Codezeile irgendwo hinzufügen

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

Deaktiviert alle console.error

Oktoeder
quelle
1
Vielen Dank! Ich habe nicht einmal bemerkt, dass mein Konsolenfehler der Grund dafür war, dass ein roter Bildschirm auftauchte. Ich dachte, etwas stimmt nicht, wenn try / catch nicht funktioniert: o.
Nick
5

console.disableYellowBox = true;

Dies funktionierte auf Anwendungsebene. Platzieren Sie es an einer beliebigen Stelle in der Datei index.js

James Siva
quelle
4

Um das gelbe Feld zu deaktivieren, platzieren Sie es an einer console.disableYellowBox = true;beliebigen Stelle in Ihrer Anwendung. In der Regel in der Root-Datei, so dass es sowohl für iOS als auch für Android gilt.

Weitere Informationen finden Sie im offiziellen Dokument

Vivek
quelle
4

console.disableYellowBox = true;

kallayya Hiremath
quelle
1

console.ignoredYellowBox = ['Warnung: Jeder', 'Warnung: Fehlgeschlagen'];

Shivo'ham 0
quelle
1

Ich stellte fest, dass selbst wenn ich bestimmte Warnungen (Yellow-Box-Nachrichten) mit den oben genannten Methoden deaktiviert habe , die Warnungen auf meinem Mobilgerät deaktiviert waren , aber immer noch auf meiner Konsole protokolliert wurden, was sehr ärgerlich und ablenkend war.

Um zu verhindern, dass Warnungen an Ihrer Konsole protokolliert werden, können Sie die warnMethode für das consoleObjekt einfach überschreiben .

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

Es ist sogar möglich, nur bestimmte Warnungen zu deaktivieren, indem Sie die bereitgestellte Meldung testen:

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

Wenn Sie zum Testen der Zeichenfolge keinen regulären Ausdruck verwenden können (oder möchten), indexOffunktioniert die Methode genauso gut:

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

Beachten Sie, dass diese Technik alle Nachrichten filtert , die die warnFunktion durchlaufen , unabhängig davon, woher sie stammen. Achten Sie daher darauf, dass Sie keine übermäßig großzügige schwarze Liste angeben, die andere bedeutsame Fehler unterdrückt, die möglicherweise von einem anderen Ort als React Native stammen.

Ich glaube auch, dass React Native die console.errorMethode zum Protokollieren von Fehlern (Red-Box-Nachrichten) verwendet. Daher gehe ich davon aus, dass diese Technik auch zum Herausfiltern bestimmter Fehler verwendet werden kann.

Fearnbuster
quelle
0

In Ihrer AppDelegate.m- Datei können Sie diese Zeile ändern:

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

und am Ende dev=truedurch ersetzen dev=false.

G. Hamaide
quelle
0

Verwandte: Unterdrücken Sie Xcode-Warnungen aus der React Native-Bibliothek

(aber nicht für Ihren eigenen Code)

Warum: Bei der Initialisierung einer neuen RN-App enthält das Xcode-Projekt näher an 100 Warnungen, die das Rauschen ablenken (ansonsten aber wahrscheinlich harmlos).

Lösung: Setzen Sie unter Build-Einstellungen für die relevanten Ziele alle Warnungen auf Ja sperren .

Geben Sie hier die Bildbeschreibung ein

Deaktivieren Sie Warnungen in Xcode in Frameworks

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

Leonard Pauli
quelle
ebenfalls; für logische Fehler; siehe "-Xanalyzer -analyzer-disable-all-tests"
Leonard Pauli
Die ursprüngliche Frage betraf die In-App-Warnung (dh das gelbe Kästchen). Ich habe diese Frage beim Versuch gefunden, die Xcode-Projektwarnungen zu bereinigen. Warum abstimmen? siehe meta.stackoverflow.com/questions/299352/…
Leonard Pauli
0

Ich empfehle einen kleinen Tool-Entwickler von unserem Team. Er sammelt alle Warnungen und Fehler im Float-Symbol. Im Vergleich dazu console.disableYellowBox = true;können Sie immer noch sehen, wo eine Warnung oder ein Fehler liegt, aber es stört Sie nicht. Geben Sie hier die Bildbeschreibung ein WT-Console Github Repo: https://github.com/WeBankFinTech/wt-console

EricHua23
quelle