Bagaimana Anda menyembunyikan peringatan di simulator iOS React Native?

Saya baru saja meningkatkan React Native saya dan sekarang simulator iOS memiliki banyak peringatan. Selain memperbaikinya, bagaimana cara menyembunyikan peringatan ini sehingga saya dapat melihat apa yang ada di bawahnya?

Menurut Bereaksi asli Dokumentasi , Anda dapat menyembunyikan pesan peringatan dengan menetapkan disableYellowBoxuntuk trueseperti ini:

console.disableYellowBox = true;

Cara yang lebih baik untuk menyembunyikan peringatan tertentu secara selektif (yang muncul tanpa batas setelah upgrade ke versi RN terbaru dan terhebat) adalah dengan mengatur console.ignoredYellowBox dalam file JS umum dalam proyek Anda. Misalnya, setelah memutakhirkan proyek saya hari ini ke RN 0,25.1, saya melihat banyak ...

Peringatan: ReactNative.createElement tidak digunakan lagi ...

Saya masih ingin dapat melihat peringatan dan pesan kesalahan yang bermanfaat dari React-Native, tetapi saya ingin menghentikan peringatan khusus ini karena berasal dari pustaka npm eksternal yang belum memasukkan perubahan yang melanggar di RN 0,25. Jadi di App.js saya, saya menambahkan baris ini ...

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

Dengan cara ini saya masih mendapatkan kesalahan lain dan peringatan yang berguna untuk lingkungan dev saya, tetapi saya tidak lagi melihat yang satu itu.

Untuk menonaktifkan tempat kotak kuning

console.disableYellowBox = true; 

di mana pun di aplikasi Anda. Biasanya di file root sehingga akan berlaku untuk iOS dan Android.

Sebagai contoh

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

Di file app.js Anda di bawah metode siklus hidup komponen apa pun. Seperti di componentDidmount () Anda harus menambahkan keduanya, mengecualikan yang mana pun tidak akan berfungsi.

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

add this line in your app main screen.

console.disableYellowBox = true;

Tambahkan kode berikut di file index.js Anda

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

Jika Anda Mencoba Mendemonstrasikan Aplikasi dengan Cepat .

Jika Anda ingin menyembunyikannya dalam build tertentu karena Anda sedang melakukan demo atau sesuatu, Anda dapat mengedit skema Xcode Anda untuk menjadikannya build rilis dan peringatan kuning ini tidak akan muncul. Selain itu, aplikasi Anda akan berjalan lebih cepat.

Anda dapat mengedit Skema untuk simulator dan perangkat nyata Anda dengan melakukan hal berikut:

1. Dalam Proyek di XCode.
2. Product> Scheme>Edit Scheme...
3. Ubah Build Configurationdari Debugmenjadi Release.

Bagi mereka yang datang dengan cara ini mencoba menonaktifkan peringatan merah dari konsol, yang memberikan informasi yang sama sekali tidak berguna, mulai Februari / 17, Anda dapat menambahkan baris kode ini di suatu tempat

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

Nonaktifkan semua console.error

console.disableYellowBox = true;

ini berfungsi untuk tingkat aplikasi. Letakkan di mana saja di file index.js

Untuk menonaktifkan tempat kotak kuning console.disableYellowBox = true;di mana saja di aplikasi Anda. Biasanya di file root sehingga akan berlaku untuk iOS dan Android.

Untuk mendapatkan detail lebih lanjut, silakan periksa dokumen resmi

console.disableYellowBox = true;

console.ignoredYellowBox = ['Peringatan: Setiap', 'Peringatan: Gagal'];

Saya menemukan bahwa bahkan ketika saya menonaktifkan peringatan tertentu (pesan kotak kuning) menggunakan metode yang disebutkan di atas, peringatan tersebut dinonaktifkan pada perangkat seluler saya, tetapi mereka masih masuk ke konsol saya, yang sangat mengganggu dan mengganggu.

Untuk mencegah peringatan dicatat ke konsol Anda, Anda cukup mengganti warnmetode pada consoleobjek.

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

Bahkan dimungkinkan untuk menonaktifkan hanya peringatan tertentu dengan menguji pesan yang disediakan:

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

Jika Anda tidak dapat (atau tidak ingin) menggunakan Ekspresi Reguler untuk menguji string, indexOfmetode ini juga akan berfungsi:

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

Ketahuilah bahwa teknik ini akan memfilter semua pesan yang melalui warnfungsi terlepas dari dari mana asalnya. Karena itu, berhati-hatilah agar Anda tidak menentukan daftar hitam yang terlalu banyak yang akan menekan kesalahan berarti lainnya yang mungkin berasal dari tempat lain selain React Native.

Juga, saya percaya bahwa React Native menggunakan console.errormetode untuk mencatat kesalahan (pesan kotak merah), jadi saya berasumsi bahwa teknik ini dapat digunakan untuk menyaring kesalahan tertentu juga.

Di file AppDelegate.m Anda, Anda dapat mengubah baris ini:

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

dan mengganti dev=truedengan dev=falsedi akhir.

Terkait: Menekan peringatan Xcode dari perpustakaan React Native

(tetapi tidak untuk kode Anda sendiri)

mengapa: saat menginisialisasi aplikasi RN baru, proyek Xcode berisi hampir 100 peringatan yang mengganggu kebisingan (tetapi mungkin tidak berbahaya jika tidak)

solusi: setel hambat semua peringatan ke ya di bawah Pengaturan Bangun untuk target yang relevan.

Nonaktifkan peringatan di Xcode dari kerangka kerja

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

Saya merekomendasikan dev alat kecil oleh tim kami, Ini mengumpulkan semua peringatan dan kesalahan ke dalam ikon float. Bandingkan dengan console.disableYellowBox = true;, Anda masih bisa melihat di mana ada peringatan atau kesalahan tetapi itu tidak mengganggu Anda. Repo Github Konsol WT: https://github.com/WeBankFinTech/wt-console