Preface
Expo 프로젝트를 진행하다 보면 앱 아이콘은 잘 바뀌는데, 유독 스플래시 이미지만 이전 상태 그대로 표시되는 답답한 상황을 마주할 때가 있습니다. Expo Go 에서는 잘 보이지만, 시뮬레이터나 실제 기기 빌드에서만 문제가 발생하죠.
이러한 이유가 왜 발생할까요?
문제의 원인: 강력한 캐시(Cache) 정책
가장 핵심적인 원인은 네이티브 환경의 강력한 캐싱 정책 때문입니다.
Expo Go 는 app.json 파일을 실시간으로 읽어서 스플래시 이미지를 보여주므로 변경사항이 바로 반영됩니다. 하지만 네이티브 빌드(iOS) 는 npx expo prebuild 또는 eas build 실행 시, 스플래시 이미지는 Xcode 프로젝트 내의 이미지 보관함(Images.xcassets)에 단 한 번 구워집니다. 이후 iOS 시스템은 이 이미지를 캐시에 저장하고, 앱을 삭제 후 재설치해도 이 캐시를 계속 보여주려는 경향이 매우 강합니다.
따라서, 단순히 재빌드만으로는 이 오래된 캐시를 이겨낼 수 없습니다.
해결 방법: 모든 캐시를 파괴하는 5단계 체크리스트 💣
오래된 캐시의 ‘잔상’ 을 완전히 제거하고 새로운 스플래시 이미지를 적용하는 가장 확실한 방법입니다.
1단계: 네이티브 프로젝트 폴더 삭제
가장 먼저, 프로젝트의 오래된 네이티브 설정을 완전히 제거하여 깨끗한 상태에서 시작합니다.
$ rm -rf ios이 ios 폴더는 다음 단계에서 app.json을 기반으로 다시 생성되므로 안심하고 삭제하셔도 됩니다.
2단계: 네이티브 프로젝트 재생성
Expo CLI 를 통해 app.json의 최신 설정을 바탕으로 깨끗한 ios 프로젝트를 다시 만듭니다.
$ npx expo prebuild --platform ios3단계: Xcode 빌드 캐시 청소
Xcode 가 가지고 있는 중간 빌드 파일들을 모두 삭제합니다.
Xcode 에서 재생성된 프로젝트(ios/[YourProjectName].xcworkspace)를 엽니다.
상단 메뉴에서 Product → Clean Build Folder 를 선택합니다. (단축키: Shift + Command + K)
4단계: 시뮬레이터 초기화
시뮬레이터에 남아있는 모든 앱 데이터와 시스템 캐시를 완전히 제거합니다.
우선 ios 시뮬레이터를 실행하고 상단 메뉴에서 Device → Reset Content and Settings 를 선택합니다.
그 후 Erase 버튼을 눌러 시뮬레이터를 완전히 초기화합니다.
실제 기기에서 테스트하는 경우, 앱을 삭제한 후 기기를 완전히 재부팅하는 것이 동일한 효과를 낸다고 합니다.
5단계: 빌드 및 실행
모든 캐시가 깨끗해진 상태에서 xcode 의 재생 버튼(▶️)을 눌러 앱을 다시 빌드하고 실행합니다. 이후 테스트를 진행해보면 스플래쉬 이미지가 나타나는 것을 확인해볼 수 있습니다.
Summary
React Native 를 다루면서 처음 해보는 IOS 스플래시 이미지 설정에 대해 정리해봤습니다. 이게 맞나 싶기도하고 다른 방법이나 대안이 있나 고민하기도 했습니다. 만약 다른 방안이 있다고 하더라도 같은 문제에 직면했고 방법을 찾지 못했다면, 이번에 소개해드리는 방법을 사용해보셔도 괜찮을 것 같습니다.