React Native + codepush 이슈

보통 React-native로 개발을 진행하고, 스토어 배포 없이 핫픽스 및 기능 업데이트를 진행할 때, 코드푸시를 많이 이용하게 됩니다.
최근 이슈 수정을 위하여 코드 푸시를 진행하였는데, 특정페이지에서 UI를 그리지 못하는 이슈가 발생하였습니다. 해당 부분은 팀원분이 작성하신 코드로 debug빌드일때는 발생하지 않지만, release모드로 실행 후 코드푸시 버전이 적용될 경우 발생하는 것으로 디버깅이 쉽지 않았다.
release모드에서 발생했기에, 의심이 가는 코드 부분에 Alert 컴포넌트를 이용하여 데이터를 체크하였습니다.

크게 이슈의 경우 children으로 전달 받은 컴포넌트의 객체에서

const componentName = (child.type as React.ComponentType)?.name || 'Unknown'

이렇게 child.type정보에 name을 접근하는 로직이 있었습니다. 하지만, 코드푸시로 받은 번들파일에서는 해당 name 정보가 없어서 렌더링을 하지 못하는 이슈였습니다.

const componentName = (child.type as React.ComponentType)?.displayName || 'Unknown'

우선 이렇게 컴포넌트의 displayName 정보를 이용하여 수정하였고, 코드푸시도 정상 적용되었습니다.

특정 코드 로직에 대한 이슈였다고 생각하지만, 왜 코드푸시로 전달받았을 경우 해당 로직이 문제가 생기는지는 조금 더 확인이 필요 할 것 같습니다.