Comment masquer les avertissements dans le simulateur React Native iOS?

107

Je viens de mettre à niveau mon React Native et maintenant le simulateur iOS a un tas d'avertissements. En plus de les réparer, comment puis-je masquer ces avertissements afin de voir ce qu'il y a en dessous?

Un gars
la source

Réponses:

208

Selon React natif Documentation , vous pouvez masquer les messages d'avertissement en mettant disableYellowBoxà la truemanière suivante:

console.disableYellowBox = true;
Moussawi7
la source
3
cela a fonctionné pour moi, mais pas les autres réponses qui disaient console.ignoredYellowBox = [...];
sdfsdf
6
Je vous remercie! Cela devrait être la réponse choisie.
Sreejith Ramakrishnan
1
Désolé, mais où ajoutez-vous console.disableYellowBox = true?
Michel Arteta
2
@Mike, n'importe où dans votre script, lorsque vous souhaitez désactiver la boîte jaune.
Moussawi 7
2
Un bon endroit pour le mettre est sur le constructeur du composant RootContainer!
Fernando Vieira
102

Une meilleure façon de masquer sélectivement certains avertissements (qui s'affichent indéfiniment après une mise à niveau vers la dernière et la meilleure version RN) consiste à définir console.ignoredYellowBox dans un fichier JS commun dans votre projet. Par exemple, après avoir amélioré mon projet aujourd'hui à RN 0.25.1, je voyais beaucoup de ...

Avertissement: ReactNative.createElement est obsolète ...

Je veux toujours pouvoir voir les avertissements et les messages d'erreur utiles de React-Native, mais je veux écraser cet avertissement particulier car il provient d'une bibliothèque npm externe qui n'a pas encore incorporé les changements de rupture dans RN 0.25. Donc dans mon App.js j'ajoute cette ligne ...

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

De cette façon, j'obtiens toujours d'autres erreurs et avertissements utiles pour mon environnement de développement, mais je ne vois plus celui-là.

Sudiste
la source
Solution parfaite pour moi, même si j'avais le même avertissement "ReactNative.createElement is deprecated".
JD Angerhofer
2
quelle part du message d'erreur devez-vous écrire pour l'ignorer?
Soorena
Cette réponse doit être mise à jour. YelloBox ne fait plus partie de react-native.
Haidar Zeineddine le
17

Pour désactiver la case jaune

console.disableYellowBox = true; 

n'importe où dans votre application. Généralement dans le fichier racine, il s'appliquera donc à iOS et Android.

Par exemple

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

Dans votre fichier app.js sous la méthode du cycle de vie de n'importe quel composant, comme dans componentDidmount (), vous devez ajouter les deux, à l'exclusion de tout ne fonctionnera pas.

console.ignoredYellowBox = ['Warning: Each', 'Warning: Failed'];
console.disableYellowBox = true;
Abdul Basit
la source
Ce n'est pas vrai, il se passe quelque chose dans votre projet. Une ligne dit «ignorer cette liste d'avertissements» (ce qui est la manière la plus précise de le faire), une ligne dit «ignorer tous les avertissements» (ce qui est une manière vraiment directe de le faire). Je n'ai que la première ligne par exemple, et elle supprime parfaitement mes avertissements.
Mike Hardy le
11

add this line in your app main screen.

console.disableYellowBox = true;

SaGaR Patel
la source
9

Ajoutez le code suivant dans votre fichier 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);
Sarthak Mishra
la source
7

Si vous essayez de faire une démonstration rapide de l'application.

Si vous souhaitez les masquer dans une version particulière parce que vous faites une démo ou quelque chose du genre, vous pouvez modifier votre schéma Xcode pour en faire une version de version et ces avertissements jaunes ne s'afficheront pas. De plus, votre application fonctionnera beaucoup plus rapidement.

Vous pouvez modifier le schéma de votre simulateur et de votre appareil réel en procédant comme suit:

  1. Dans Project dans XCode.
  2. Product> Scheme>Edit Scheme...
  3. Changer Build Configurationde Debugà Release.
Joshua Pinter
la source
1
Devrait être la réponse acceptée. In Release: pas d'avertissement et application plus rapide!
cappie013
2
Vous n'obtenez aucune fonctionnalité de débogage dansRelease
Phil Andrews
1
@PhilAndrews Je suis d'accord! Je ne sais pas que j'ai posté de cette façon à l'époque, mais il y a suffisamment de personnes qui le trouvent utile pour que je le quitte. J'ai dû essayer de faire une démonstration de l'application à quelqu'un et je voulais me débarrasser des avertissements jaunes, auquel cas, c'est la bonne voie à suivre.
Joshua Pinter
5

Pour ceux qui viennent de cette façon essayant de désactiver les avertissements rouges de la console, qui donnent des informations absolument inutiles, à partir du 17 février, vous pouvez ajouter cette ligne de code quelque part

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

Désactive tout console.error

octoèdre
la source
1
Merci! Je n'avais même pas réalisé que l'erreur de ma console était la raison pour laquelle un écran rouge apparaissait. Je pensais que quelque chose n'allait pas avec try / catch ne fonctionnait pas: o.
Nick
5

console.disableYellowBox = true;

cela a fonctionné pour le niveau de l'application Mettez-le n'importe où dans le fichier index.js

James Siva
la source
4

Pour désactiver la boîte jaune, placez-le console.disableYellowBox = true;n'importe où dans votre application. Généralement dans le fichier racine, il s'appliquera donc à iOS et Android.

Pour obtenir plus de détails, veuillez consulter le document officiel

Vivek
la source
4

console.disableYellowBox = true;

kallayya Hiremath
la source
1

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

Shivo'ham 0
la source
1

J'ai constaté que même lorsque je désactivais des avertissements spécifiques (messages de boîte jaune) en utilisant les méthodes mentionnées ci-dessus, les avertissements étaient désactivés sur mon appareil mobile, mais ils étaient toujours enregistrés sur ma console, ce qui était très ennuyeux et distrayant.

Pour éviter que les avertissements ne soient consignés sur votre console, vous pouvez simplement remplacer la warnméthode sur l' consoleobjet.

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

Il est même possible de désactiver uniquement des avertissements spécifiques en testant le message fourni:

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

Si vous ne pouvez pas (ou ne voulez pas) utiliser une expression régulière pour tester la chaîne, la indexOfméthode fonctionnera tout aussi bien:

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

Sachez que cette technique filtrera tous les messages qui passent par la warnfonction indépendamment de leur origine. Pour cette raison, veillez à ne pas spécifier une liste noire trop généreuse qui supprimera d'autres erreurs significatives pouvant provenir d'un endroit autre que React Native.

De plus, je pense que React Native utilise la console.errorméthode pour consigner les erreurs (messages de boîte rouge), donc je suppose que cette technique pourrait également être utilisée pour filtrer des erreurs spécifiques.

Fearnbuster
la source
0

Dans votre fichier AppDelegate.m , vous pouvez modifier cette ligne:

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

et remplacez dev=truepar dev=falseà la fin.

G. Hamaide
la source
0

Connexes: supprimer les avertissements Xcode de la bibliothèque React Native

(mais pas pour votre propre code)

pourquoi: lors de l'initialisation d'une nouvelle application RN, le projet Xcode contient plus de 100 avertissements qui gênent le bruit (mais probablement inoffensifs sinon)

solution: définissez inhiber tous les avertissements sur yes sous Build Settings pour les cibles concernées.

entrez la description de l'image ici

Désactiver les avertissements dans Xcode à partir des frameworks

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

Leonard Pauli
la source
aussi; pour les erreurs de logique; voir "-Xanalyzer -analyzer-disable-all-checks"
Leonard Pauli
La question d'origine concernait l'avertissement dans l'application (par exemple, la boîte jaune), j'ai trouvé cette question en essayant de nettoyer les avertissements du projet Xcode. Pourquoi voter contre? voir meta.stackoverflow.com/questions/299352/…
Leonard Pauli
0

Je recommande un petit développement d'outils par notre équipe, il collecte tous les avertissements et erreurs dans l'icône du flotteur. Comparé à console.disableYellowBox = true;, vous pouvez toujours voir où se trouve un avertissement ou une erreur, mais cela ne vous dérange pas. entrez la description de l'image ici Repo Github WT-Console: https://github.com/WeBankFinTech/wt-console

EricHua23
la source