최종 수정일 : 2022-08-20
에러바운더리란?
https://ko.reactjs.org/docs/error-boundaries.html#gatsby-focus-wrapper
명령형 대신 선언형으로 에러를 처리하기 위해 회사에서 쓰고 있다.
에러바운더리에서 에러를 캐치하지 못하는 경우
에러바운더리로 컴포넌트를 감쌌으나, 이 에러바운더리도 캐치하지 못하는 에러들이 있다.
공식문서에서도 알려준다.
Note
에러 경계는 다음과 같은 에러는 포착하지 않습니다.
이벤트 핸들러 (더 알아보기)
비동기적 코드 (예: setTimeout 혹은 requestAnimationFrame 콜백)
서버 사이드 렌더링
자식에서가 아닌 에러 경계 자체에서 발생하는 에러그래서 내가 겪은 문제
비동기 처리를 할 때, 에러가 나니까 에러바운더리에서 걸러내지 못하고 Uncaught Error가 떴다.
찾아보니 에러바운더리도 캐치하지 못하는 에러가 있었다.
https://www.smashingmagazine.com/2020/06/react-error-handling-reporting-error-boundary-sentry/
그럼 이것을 어떻게 에러바운더리나 선언형으로 걸러내지?
명령적 해결 - https://wani.kr/posts/2015/03/09/js-something-2-catchable-settimeout-exception/
선언적 해결 - https://jbee.io/react/error-declarative-handling-3/
unhandledrejection event를 사용한다.
참고로 catch하고 버블링되는 걸 막지 않았더니 uncaught에러가 났다. 멍청이..
Always Develop