React Native iOS 시뮬레이터에서 경고를 어떻게 숨기나요?

방금 React Native를 업그레이드했고 이제 iOS 시뮬레이터에 많은 경고가 있습니다. 문제를 해결하는 것 외에도 아래 내용을 볼 수 있도록 이러한 경고를 숨기려면 어떻게해야합니까?

React Native Documentation 에 따르면 다음과 같이 설정 disableYellowBox하여 경고 메시지를 숨길 수 있습니다 true.

console.disableYellowBox = true;

특정 경고 (최신 및 최고의 RN 버전으로 업그레이드 한 후 무기한 표시됨)를 선택적으로 숨기는 더 좋은 방법은 프로젝트의 공통 JS 파일에 console.ignoredYellowBox 를 설정 하는 것입니다. 예를 들어 오늘 내 프로젝트를 RN 0.25.1로 업그레이드 한 후 많은 것을 보았습니다.

경고 : ReactNative.createElement는 더 이상 사용되지 않습니다 ...

여전히 React-Native에서 유용한 경고와 오류 메시지를 볼 수 있기를 원하지만이 특정 경고는 아직 RN 0.25의 주요 변경 사항을 통합하지 않은 외부 npm 라이브러리에서 온 것이기 때문에이 특정 경고를 무시하고 싶습니다. 그래서 내 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'];

이렇게하면 개발 환경에 도움이되는 다른 오류와 경고가 계속 표시되지만 더 이상 특정 오류가 표시되지 않습니다.

노란색 상자 장소를 비활성화하려면

console.disableYellowBox = true; 

응용 프로그램의 어느 곳에서나. 일반적으로 루트 파일에 있으므로 iOS와 Android 모두에 적용됩니다.

예를 들면

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

componentDidmount ()에서와 같이 구성 요소의 수명주기 method.like 아래의 app.js 파일에서 둘 다 추가해야합니다.

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

add this line in your app main screen.

console.disableYellowBox = true;

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

앱 을 빠르게 데모 하려는 경우 .

데모 등을 수행하고 있기 때문에 특정 빌드에서 숨기려면 Xcode 체계를 편집하여 릴리스 빌드로 만들면 노란색 경고가 표시되지 않습니다. 또한 앱이 훨씬 빠르게 실행됩니다.

다음을 수행하여 시뮬레이터 및 실제 장치의 구성표를 편집 할 수 있습니다.

1. XCode의 프로젝트에서.
2. Product> Scheme>Edit Scheme...
3. Build Configuration에서 Debug로 변경하십시오 Release.

이 방법으로 오는 사람들은 2 월 17 일부터 절대적으로 쓸모없는 정보를 제공하는 콘솔에서 빨간색 경고를 비활성화하려는 경우이 코드 줄을 어딘가에 추가 할 수 있습니다.

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

모두 비활성화 console.error

console.disableYellowBox = true;

이것은 응용 프로그램 수준에서 작동했습니다 .index.js 파일의 아무 곳에 나 넣으십시오.

노란색 상자를 비활성화하려면 console.disableYellowBox = true;응용 프로그램의 아무 곳에 나 놓습니다. 일반적으로 루트 파일에 있으므로 iOS와 Android 모두에 적용됩니다.

자세한 내용은 공식 문서 를 확인하세요.

console.disableYellowBox = true;

console.ignoredYellowBox = [ '경고 : 각각', '경고 : 실패'];

위에서 언급 한 방법을 사용하여 특정 경고 (노란색 상자 메시지)를 비활성화 한 경우에도 내 모바일 장치 에서 경고 가 비활성화되었지만 여전히 내 콘솔에 기록되고있어 매우 성 가시고 산만했습니다.

경고가 콘솔에 기록되지 않도록하려면 개체 의 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오류 (빨간 상자 메시지)를 기록 하는 방법을 사용한다고 생각하므로이 기술을 사용하여 특정 오류를 필터링 할 수도 있다고 가정합니다.

당신에 AppDelegate.m의 파일이 라인을 변경할 수 있습니다 :

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

그리고 끝에 dev=true의해 교체하십시오 dev=false.

관련 : React Native 라이브러리에서 Xcode 경고 억제

(그러나 자신의 코드에는 해당되지 않음)

이유 : 새로운 RN- 앱을 초기화 할 때 Xcode 프로젝트에는주의를 분산시키는 100 개에 가까운 경고가 포함됩니다 (하지만 그렇지 않으면 무해 할 수 있음).

솔루션 : 설정 한 모든 경고 억제 에 예 에 따라 빌드 설정 관련 대상에 대해.

프레임 워크의 Xcode에서 경고 비활성화

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

나는 우리 팀의 작은 도구 개발자를 추천합니다. 모든 경고와 오류를 플로트 아이콘에 수집합니다. 와 비교하여 console.disableYellowBox = true;경고 또는 오류가있는 위치를 계속 볼 수 있지만 방해하지 않습니다. WT-Console Github Repo : https://github.com/WeBankFinTech/wt-console