React Native 0.81 and Expo 54

반응형

 

 

https://expo.dev/changelog/sdk-54

 

 

 

https://react-native-community.github.io/upgrade-helper/?from=0.79.2&to=0.81.0

 

https://docs.expo.dev/bare/upgrade/?fromSdk=53&toSdk=54

 

오늘 Expo SDK 54의 출시를 발표합니다. SDK 54에는 React Native 0.81이 포함되어 있습니다. 베타 테스트에 도움을 주신 모든 분들께 감사드립니다.

 

iOS용 사전 컴파일된 React Native

React Native 0.81 및 Expo SDK 54부터 iOS용 React Native와 그 의존성들이 소스와 함께 사전 컴파일된 XCFramework 형태로 제공됩니다.

 

[사전 컴파일된 XCFramework를 사용했을 때] RNTester의 클린 빌드 시간이 약 120초에서 10초로 단축된 것을 확인했습니다(M4 Max 기준 - 정확한 수치는 머신 사양에 따라 달라집니다). 대부분의 앱에서는 여전히 컴파일해야 하는 다른 의존성들이 많기 때문에 ~10배의 빌드 시간 개선을 보기는 어렵겠지만, 대규모 프로젝트에서는 눈에 띄는 빌드 시간 단축을, React Native가 빌드 시간에서 더 큰 비중을 차지하는 소규모 프로젝트에서는 훨씬 더 뚜렷한 개선을 기대할 수 있습니다.

 

속도 향상의 장점 외에도, 이 개선사항은 React Native와 Expo 프로젝트에서 CocoaPods에서 Swift Package Manager로 전환할 수 있게 해주는 데 한 걸음 더 가까워지게 해줍니다.

Podfile에서 use_frameworks!를 사용하거나 (expo-build-properties에서 useFrameworks를 사용하는) 앱의 경우, 항상 소스에서 빌드되므로 아직은 이 개선사항의 혜택을 받을 수 없습니다. 가까운 미래에 이 경우에 대한 지원을 추가할 예정입니다.

iOS용 사전 컴파일된 React Native: 0.81에서 더 빠른 빌드가 제공됩니다 에서 자세히 알아보세요.

 

iOS 26 및 Liquid Glass Liquid Glass 아이콘 및 Icon Composer 지원

 

SDK 54에서는 새로운 Icon Composer 앱을 사용하여 만들 수 있는 iOS 26 Liquid Glass 아이콘에 대한 지원이 추가되었습니다. Icon Composer 앱은 .icon 파일을 생성하며, 이를 app.json의 ios.icon 키 아래에서 참조할 수 있습니다:

{
  "ios": {
    "icon": "./assets/app.icon"
  },
  "android": {
    "adaptiveIcon": {
      ...
    }
  }
}

 

Icon Composer 앱은 macOS 전용이라는 점을 유의해야 합니다. 앱을 실행할 수 있는 macOS 머신에 접근할 수 없다면 아이콘 빌드를 위한 UI를 활용할 수 없습니다. 하지만 출력물은 비교적 간단한 JSON이므로 이를 처리할 수 있는 도구가 등장할 가능성이 있습니다.

이 아이콘 형식을 사용하는 앱이 이전 iOS 버전(iOS ≤ 19)에서 실행될 때는 운영체제에서 자동으로 적절한 대체 아이콘을 제공합니다.

 

앱에서 Liquid Glass 뷰 사용하기

 

이러한 효과들을 이 YouTube 쇼츠에서 실시간으로 확인해보세요. iOS 26 하단 탭 UI도 주목해보세요 — 이는 Expo Router v6에서 사용할 수 있습니다. 자세한 정보는 아래 Expo Router 섹션을 참조하세요.

 

UIKit 사용하기 (현재 대부분의 Expo 앱에서 최선의 선택)

새로운 expo-glass-effect 라이브러리와 UIVisualEffectView를 기반으로 구축된 <GlassView> 및 <GlassContainer> 뷰를 사용하여 앱에서 Liquid Glass 뷰를 원활하게 사용할 수 있습니다. expo-glass-effect에 대해 자세히 알아보세요.

import { StyleSheet, View, Image } from 'react-native';
import { GlassView } from 'expo-glass-effect';

export default function App() {
  return (
    
      https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=400&fit=crop',
        }}
      />
      {/* 기본 Glass View */}
      
      {/* clear 스타일의 Glass View */}
      
    
  );
}

 

SwiftUI 사용하기 (베타 Expo UI 라이브러리를 체험해보세요!)

Expo 앱에서 SwiftUI 프리미티브를 제공하는 라이브러리인 iOS용 Expo UI가 현재 베타 버전입니다. 이 릴리스에는 Liquid Glass SwiftUI 모디파이어, 버튼 변형 등을 지원하는 것 외에도 문서에 새로운 가이드가 포함되어 있습니다.

import { Host, HStack, Text } from "@expo/ui/swift-ui";
import { glassEffect, padding } from '@expo/ui/swift-ui/modifiers';

// 컴포넌트 내에서
<Host matchContents>
  <HStack
    alignment='center'
    modifiers={[
      padding({
        all: 16,
      }),
      glassEffect({
        glass: {
          variant: 'regular',
        },
      }),
    ]}>
    <Text>Regular glass effect</Text>
  </HStack>
</Host>

Xcode 26 및 Liquid Glass

위에서 언급한 iOS 26 기능을 활용하려면 Xcode 26으로 프로젝트를 컴파일해야 합니다.

EAS Build와 Workflows는 SDK 54 프로젝트에 대해 기본적으로 Xcode 26을 사용합니다. 자신의 머신에서 프로젝트를 빌드하는 경우, Apple Developer Releases 페이지에서 최신 버전의 Xcode를 다운로드할 수 있습니다. Xcode 26은 현재 RC 상태이며, GM은 9월 15일에 Apple에서 출시될 예정입니다. 지금 Xcode 26으로 앱을 빌드하면 iOS 26 출시 즉시(역시 9월 15일) 준비된 상태가 될 수 있습니다. Xcode 26으로 빌드된 새 버전의 Expo Go도 곧 출시될 예정입니다.

 

 

 

Android용 React Native가 이제 Android 16 / API 36을 타겟팅합니다

 

Edge-to-edge가 이제 항상 활성화됩니다

Expo SDK 54와 React Native 0.81이 이제 Android 16을 타겟팅하면서, 모든 Android 앱에서 edge-to-edge가 활성화되며 비활성화할 수 없습니다. 또한 라이브러리 작성자인 Mathieu Acthernoene이 필요한 기능을 React Native에 내장했기 때문에 react-native-edge-to-edge는 더 이상 expo 패키지의 종속성이 아닙니다. 프로젝트에서 edge-to-edge를 구성하기 위해 react-native-edge-to-edge 설정 플러그인을 사용하고 있다면, 해당 패키지가 프로젝트의 직접 종속성인지 확인하세요(npx expo install react-native-edge-to-edge). enforceNavigationBarContrast 옵션을 구성하기 위해서만 플러그인을 사용하고 있었다면, 추가 종속성 없이 app.json의 새로운 androidNavigationBar.enforceContrast 속성을 사용하여 동일한 효과를 얻을 수 있습니다.

예측 뒤로가기 제스처를 옵트인으로 사용 가능 Android 예측 뒤로가기 제스처 기능은 SDK 54의 모든 프로젝트에서 기본적으로 비활성화되어 있으며, 프로젝트의 app.json에서 android.predictiveBackGestureEnabled로 활성화할 수 있습니다. edge-to-edge와 마찬가지로 옵트아웃은 결국 향후 Android 버전에서 제거될 것으로 예상되며, SDK 55 또는 56의 모든 프로젝트에서 기본적으로 활성화할 계획입니다. 자세히 알아보기.

 

Expo Updates & EAS Update

  • **Update가 전송하는 HTTP 헤더(예: channel)를 이제 런타임에 **Updates.setUpdateRequestHeadersOverride()로 재정의할 수 있습니다. 이를 통해 개발자들은 직원들을 최종 사용자와 다른 업데이트 채널에 쉽게 옵트인시키는 것과 같은 패턴을 구현할 수 있습니다. 업데이트 URL도 재정의할 수 있고 disableAntiBrickingMeasures 빌드 타임 플래그가 필요한 Updates.setUpdateURLAndRequestHeadersOverride()와 달리, 새로운 메서드는 헤더에만 적용되고 플래그 설정 없이 사용할 수 있으며 프로덕션 앱에서 안전하게 사용할 수 있습니다. 어느 방법으로든 설정된 구성은 현재 실행 중인 앱에 즉시 적용됩니다. 즉, 새로운 구성이 적용되기 위해 앱을 재시작할 필요가 없고, 헤더를 업데이트한 후 Updates.fetchUpdateAsync()와 Updates.reloadAsync()를 호출할 수 있습니다. 요청 헤더 재정의에 대해 자세히 알아보기.
  • **useUpdates() 훅에 이제 **downloadProgress 속성이 포함되어 있으며, 이를 사용하여 업데이트 중 에셋 다운로드 진행상황을 추적할 수 있습니다. 이를 사용하여 업데이트 다운로드 시 진행률 표시줄을 보여주거나, 기타 창의적인 시나리오에 활용할 수 있습니다. 자세히 알아보기.
  • Updates.reloadAsync()가 이제 reloadScreenOptions를 허용하여 앱이 다시 로드되는 동안 표시되는 UI를 개발자가 제어할 수 있게 해줍니다. 이는 빈 콘텐츠가 깜박이는 것보다 훨씬 나은 사용자 경험을 제공합니다. 다음 예제 구성은 전체 화면 이미지를 표시하고 업데이트가 적용되면 페이드아웃됩니다: 개발 환경에서는 Updates.showReloadScreen({ reloadScreenOptions })와 Updates.hideReloadScreen()을 사용하여 리로드 화면 구성을 테스트할 수 있습니다.
import * as Updates from 'expo-updates';

Updates.reloadAsync({
  reloadScreenOptions: {
    backgroundColor: '#fa0000',
    image: require('./assets/images/reload.jpg'),
    imageResizeMode: 'cover',
    imageFullScreen: true,
    fade: true
  },
});

 

 

향상된 패키지 매니저 지원 및 Expo Autolinking 개편

워크스페이스(monorepos)를 지원하는 패키지 매니저, 격리된 종속성 설치, 그리고 종속성에 활성 호이스팅 충돌이 있을 때 Expo 프로젝트 실행의 안정성을 개선하는 작업을 진행했습니다. 이를 지원하기 위해 Expo Autolinking에도 여러 변경사항이 적용되었습니다:

  • 전이 종속성으로 설치된 React Native 모듈들이 이제 자동링크됩니다. Expo Autolinking은 Expo 모듈에 대해 항상 이런 식으로 작동했지만, React Native 모듈 링크 처리를 담당하게 되면서(SDK 52부터) React Native 모듈에 대해서도 이 동작을 구현할 수 있게 되었습니다. 이는 라이브러리들이 자신의 종속성을 직접 관리할 수 있게 해주며, 네이티브 종속성들을 대신 설치하는 명령어를 복사 붙여넣기할 필요가 없다는 의미입니다(자세히 알아보기). 앱의 package.json에 expo.autolinking.legacy_shallowReactNativeLinking: true 플래그를 추가하여 이전 autolinking 동작으로 되돌릴 수 있습니다.
  • Expo와 React Native 모듈들이 이제 node_modules 폴더를 스캔하는 대신 앱의 직접 및 중첩된 종속성에 따라 링크됩니다. 이제 앱이나 앱의 종속성이 dependencies 또는 peerDependencies에 네이티브 모듈을 포함해야 링크가 됩니다. 앱의 package.json의 expo.autolinking.searchPaths에 node_modules 폴더를 추가하여 이전 autolinking 동작으로 되돌릴 수 있습니다.
  • Expo Autolinking이 이제 Expo와 React Native 모듈에서 통합된 동작을 제공하므로, 격리된 종속성 설치(Bun과 pnpm) 및 호이스팅 충돌에 대해 더 예측 가능하게 동작합니다.

종속성 처리 방식에 영향을 주는 변경사항들은 종종 예상할 수 없는 더 독특한 프로젝트 구성에서 문제를 일으킬 수 있습니다. 이러한 변경사항의 영향을 받을 수 있다고 생각되면 npx expo-modules-autolinking verify -v의 출력이나 Expo Doctor를 사용하여 예상되는 네이티브 모듈을 사전에 확인할 수 있습니다. 위에서 언급한 autolinking 변경사항을 비활성화해야 하는 경우, 앱의 package.json에 다음을 추가하세요:

{
  "expo": {
    "autolinking": {
      "legacy_shallowReactNativeLinking": true,
      "searchPaths": ["../../node_modules", "node_modules"]
    }
  }
}

이러한 변경사항들은 네이티브 모듈 링킹에 영향을 주지만, 이제 Expo CLI의 번들링에도 실험적으로 적용될 수 있으며, 이는 네이티브 모듈 중복 해결에 적극적으로 도움을 주거나 단일 monorepo에서 React나 네이티브 모듈의 여러 버전을 설치할 수 있게 해줍니다. 이를 테스트하려면 app.json에서 experiments.autolinkingModuleResolution을 true로 설정하세요.

모든 인기 있는 패키지 매니저(Bun, npm, pnpm, Yarn)가 이제 지원되며, monorepo 가이드가 업데이트되었고, Expo Doctor와 Expo CLI도 그에 맞게 업데이트되었습니다.

 

SDK 54는 Legacy Architecture 지원을 포함하는 마지막 릴리스입니다

React Native 0.80에서 React Native 팀은 Legacy Architecture에 대한 코드 동결을 도입했습니다. React Native 0.82에서는 더 이상 New Architecture에서 옵트아웃할 수 없게 됩니다. 이는 React Native 0.83을 포함할 가능성이 높은 SDK 55가 New Architecture만 지원한다는 의미입니다.

최근 몇 달 동안 점점 더 많은 라이브러리들이 새로운 아키텍처만 지원하기 시작했습니다. 예를 들어: react-native-reanimated v4와 @shopify/react-native-flashlist v2가 그렇습니다. 상호 운용 레이어는 Legacy Architecture용으로 구축된 라이브러리들이 최신 앱에서도 계속 잘 작동하도록 보장하기 위해 당분간 React Native의 일부로 남아있을 예정입니다.

작성 시점 기준으로 EAS에서 빌드된 SDK 53 프로젝트의 75%가 New Architecture를 사용하고 있습니다. 마이그레이션이 여전히 걱정된다면, "수백만 상인들을 서비스하는" 주요 Shopify 앱과 POS 앱과 같은 가장 큰 React Native 앱들을 마이그레이션하면서 발견된 마지막 남은 식별된 문제들을 해결하기 위해 수행된 작업에 대해 자세히 알아보세요.

 

 

주요 내용

React Native 0.81과 React 19.1을 포함합니다. 자세한 정보는 React Native 0.81 릴리스 노트와 React 19.1 변경 로그를 참조하세요. 또한 React Native 버전 추적을 위한 Expo SDK 정책에 대해서도 자세히 알아보세요.

expo-file-system/next가 안정화되었습니다: 새로운 expo-file-system API가 이제 안정화되어 기본값으로 노출됩니다. 업그레이드 전에 이를 사용하고 있었다면 import를 expo-file-system/next → expo-file-system으로 업데이트해야 합니다. 기존 API는 여전히 expo-file-system/legacy에서 사용할 수 있습니다. 개선사항으로는 파일 및 디렉토리 작업을 위한 객체 지향 API, Android의 SAF URI 지원, iOS와 Android 모두에서 번들된 에셋 지원이 포함됩니다. 곧 출간될 블로그 포스트에서 더 자세한 정보를 확인할 수 있으며, 그동안 API 레퍼런스를 참조할 수 있습니다.

expo-sqlite에 이제 localStorage 웹 API의 drop-in 구현이 포함되었습니다. 웹에서 이 API에 이미 익숙하거나 웹과 다른 플랫폼 간에 스토리지 코드를 공유하고 싶다면 유용할 것입니다. localStorage API를 가져오고 설치하는 방법을 알아보세요.

Prebuild 템플릿이 이제 npm에서 다운로드하는 대신 expo 패키지에 포함됩니다. 이를 통해 새로운 템플릿 버전이 출시되더라도 주어진 expo 패키지 버전에서 사용되는 템플릿이 변경되지 않도록 보장합니다. expo 패키지를 업데이트하면 새로운 템플릿 버전도 함께 가져옵니다. 이 변경을 제안해준 Thibault Malbranche에게 감사드립니다. 여전히 --template 플래그로 사용자 정의 prebuild 템플릿을 제공할 수 있습니다.

expo-sqlite에 SQLite 확장 로딩을 지원하는 loadExtensionAsync()와 loadExtensionSync() API가 추가되었습니다. 벡터 데이터 처리를 지원하는 sqlite-vec 확장도 옵트인 확장으로 expo-sqlite에 번들로 제공됩니다. sqlite-vec을 일부 RAG AI 작업에 사용할 수 있습니다. expo#38693의 구현, loadExtensionAsync() API 사용법, sqlite-vec을 옵트인하는 withSQLiteVecExtension config-plugin 옵션을 참조하세요.

expo-app-integrity: iOS의 DeviceCheck(DCAppAttestService)와 Android의 Play Integrity API를 사용하여 앱 무결성을 검증하는 새 패키지입니다. 이를 통해 앱이 App Store나 Play Store를 통해 설치되었고 정품이며 변조되지 않은 기기에서 실행되고 있음을 확인할 수 있습니다. 자세히 알아보기.

expo/blob: iOS와 Android에서 바이너리 대용량 객체(binary large objects) 작업을 위한 새 패키지입니다. 우리의 구현은 W3C 사양과 일치하여 웹에서 익숙한 인터페이스를 제공합니다. expo-blob은 현재 베타 버전이며, 여러분의 피드백을 기대하고 있습니다! 이 라이브러리는 아직 Expo Go에 포함되지 않았습니다.

expo-maps: Google Maps에서 JSON 및 Google Cloud 기반 맵 ID 스타일링과 Apple Maps에서 관심 지점(POI) 필터링 지원이 추가되었습니다. 자세히 알아보기.

buildCacheProvider가 실험적에서 안정화로 승격되었습니다. 빌드 캐시 프로바이더를 사용할 때 npx expo run:[android|ios]는 동일한 지문을 가진 프로젝트의 가장 최근 빌드가 있으면 자동으로 다운로드합니다. 해당 지문에 대한 빌드가 아직 없으면 npx expo run이 평소대로 계속되어 프로젝트를 컴파일하고, 실행 후 빌드를 캐시 프로바이더에 업로드합니다. GitHub와 EAS와의 기본 통합이 제공되며, 선호하는 위치에 빌드를 캐시하기 위한 사용자 정의 프로바이더를 구현할 수 있습니다(원한다면 NAS에 복사하는 것도 가능). 프로젝트에 EAS가 이미 구성되어 있다면 npx expo install eas-build-cache-provider를 실행하고 app.json에 "buildCacheProvider": "eas"를 추가하면 됩니다! 설정이 완료되면 eas fingerprint:compare를 사용하여 지문이 변경된 원인을 쉽게 이해할 수도 있습니다. GitHub와 EAS 빌드 캐시 프로바이더 사용법과 직접 만드는 방법에 대해 자세히 알아보기.

브라운필드 경험 개선 및 추가 개선 예정. 브라운필드 경험을 지속적으로 개선하고 있으며, 네이티브 앱 통합에 대한 문서를 다시 작성하고 있습니다. 또한 사용자 정의 폴더 구조 지원도 추가했는데, 이는 네이티브 프로젝트를 android와 ios 디렉토리로 이동하는 것이 현실적이지 않은 대규모 코드베이스에서 특히 유용합니다. 자세히 알아보기.

Expo Go가 곧 Meta Horizon Store에 출시됩니다. face에서 Expo Go 사용을 시작하는 방법과 Horizon 스토어용 앱을 직접 빌드하는 방법에 대한 자세한 내용을 곧 후속으로 알려드리겠습니다. Horizon 운영체제는 큰 발전을 이뤘으며, 그 위에서 앱을 실행하는 것은 예상보다 훨씬 쉬울 것입니다!

expo-dev-launcher 재작성: React Native와의 인터페이스를 단순화하고 Hermes 디버깅 경험을 개선하기 위해 expo-dev-client UI를 재구축했습니다. 이 과정에서 외관과 느낌에 대한 다른 개선사항들도 만들었습니다 — 어떻게 생각하시는지 알려주세요!

 

Apple TV 및 Android TV

  • Apple TV용 실험적 expo-dev-client 지원, Android TV 완전 지원. tvOS 지원은 아직 초기 단계이며, 앱에서 Expo 계정으로 인증할 수는 아직 없지만, Apple TV가 있다면 한 번 시도해보고 어떻게 생각하시는지 알려주세요.
  • 다양한 SDK 패키지에서 Apple TV 지원 추가: expo-sqlite, expo-background-task, expo-task-manager, expo-insights, expo-image-loader, expo-image-manipulator, expo-video-thumbnails. 자세한 내용은 각 패키지의 문서 페이지를 참조하세요.
  • tvOS 빌드가 React Native 0.81에서 제공되는 새로운 사전 컴파일된 프레임워크를 활용합니다: 이를 통해 이러한 플랫폼의 빌드 시간이 크게 단축됩니다(관련 블로그).

 

Expo CLI

  • Import 스택 추적이 이제 기본적으로 활성화됩니다. 이제 누락된 모듈로 이어지는 import 목록을 볼 수 있어 손상된 패키지를 추적하기가 훨씬 쉬워집니다. 이 기능을 통해 에이전트(claude code 같은)가 항상 손상된 import를 해결할 수 있다는 것을 발견했습니다.
  • experimentalImportSupport가 이제 기본적으로 활성화됩니다. React Compiler와 tree shaking을 더 잘 지원하기 위해 Expo CLI의 Metro ESM 지원을 재구축했습니다. 이는 Expo에서 완전한 ESM 지원에 한 걸음 더 가까워지게 해줍니다.
    • metro.config.js에서 experimentalImportSupport: false로 설정하여 이전 시스템으로 되돌릴 수 있습니다. 다음 SDK 릴리스에서 이 플래그를 완전히 제거할 계획입니다.
    • 재구축된 지원은 ECMAScript 사양 준수를 개선하고 광범위한 프로젝트를 지원하기 위해 기본적으로 live binding을 사용합니다. 원하지 않는다면 EXPO_UNSTABLE_LIVE_BINDINGS=false로 설정하세요. live binding을 비활성화하면 많은 프로젝트에서 문제가 발생하고 순환 import 지원이 중단됩니다.
  • **Expo CLI가 이제 Rust 기반 **lightningcss를 사용하여 기본적으로 CSS를 자동 접두사화합니다. 이 구현을 위해 postcss.config.mjs 파일에서 autoprefixer를 제거할 수 있습니다. 또한 CSS 접두사를 위한 package.json의 browserslist 지원도 추가했습니다. 자세히 알아보기.
  • @babel/plugin-transform-class-static-block이 이제 babel-preset-expo에 기본적으로 추가됩니다. 이를 통해 더 광범위한 웹 및 서버 라이브러리 세트가 기본적으로 Expo와 작동할 수 있게 됩니다. static class block에 대해 자세히 알아보기.
  • React Compiler가 이제 기본 템플릿에서 활성화됩니다. 프로젝트에서 사용하는 것을 권장합니다. Meta 팀이 React Compiler의 남은 문제들에 대한 지원을 적극적으로 제공하고 있습니다. Expo CLI에서 J를 눌러 컴포넌트 패널로 이동하면 어떤 컴포넌트가 메모화되었는지 확인할 수 있습니다. npx expo start를 실행하면 로그에 "Experimental React Compiler is enabled."가 출력되는 것을 볼 수 있습니다 — 이는 현재 Release Candidate 상태이기 때문입니다. 하지만 대부분의 앱에 준비되었다고 생각합니다. 베타 기간 동안 이것이 거짓으로 판명되면 이 기본값이 변경될 수 있습니다. Expo + React Compiler 문서에서 자세히 알아보기.
  • React Native owner stack이 이제 기본적으로 활성화됩니다. 이는 React 컴포넌트에서 발생하는 오류를 개선하고 인간과 에이전트 모두에게 문제를 찾고 수정하기 쉽게 만듭니다.
  • 처리되지 않은 promise rejection이 이제 오류로 기록됩니다. 이 SDK로 업그레이드한 후 모바일 애플리케이션에서 새로운 promise rejection 오류를 발견할 수 있습니다. 이는 SDK 자체에 의해 발생한 것이 아니라 이제 오류로 적절히 표면화된 것으로, 웹 브라우저에서 Promise가 작동하는 방식과 일치합니다.
  • 실험적 autolinking 모듈 해상도가 추가되었습니다. Expo CLI가 이제 Expo Autolinking의 링킹 결정을 JavaScript 모듈 해상도에 적용할 수 있습니다. 이는 종속성 충돌과 중복이 있어도 네이티브 모듈과 JavaScript 모듈 간의 불일치를 방지하고, react와 react-dom을 단일 버전으로 해결합니다. app.json에서 experiments.autolinkingModuleResolution을 true로 설정하여 테스트하세요.
  • **권장 TypeScript 버전을 **~5.9.2로 상향했습니다.
  • SDK 53에서의 알림: import.meta 변환 플러그인은 여전히 실험적 옵트인 기능으로, babel-preset-expo 구성에서 unstable_transformImportMeta 옵션으로 활성화할 수 있습니다(예제). ESM 종속성 중 일부가 import.meta에 의존한다면 이를 활성화하세요.

 

Expo Router

 

  • Link가 이제 iOS 뷰 컨트롤러 미리보기, 전환, 컨텍스트 메뉴 항목을 지원합니다. 이를 사용하여 앱의 모든 링크에 빠른 작업과 정보를 추가할 수 있습니다. 자세히 알아보기.
  • iOS와 Android에서 네이티브 탭에 대한 베타 지원. JS 탭 구현과 달리 이는 liquid glass 탭, 탭 누를 때 자동 스크롤, 그리고 많은 다른 아름다운 네이티브 효과를 가능하게 합니다. API는 아직 개발 중이며 import에서 unstable- 접두사를 제거할 때까지 주요 변경사항이 있을 수 있습니다. 자세히 알아보기.
  • 웹에서 모달이 이제 모달과 같은 속성 없이 단순히 전체 화면 페이지가 되는 대신 iPad와 iPhone 동작을 에뮬레이트합니다.
  • 새로운 실험적 서버 미들웨어 지원. 미들웨어는 요청이 라우트에 도달하기 전에 코드를 실행하는 데 사용할 수 있습니다. 자세히 알아보기.
  • TextDecoderStream과 TextEncoderStream이 fetch 스트리밍과 AI 작업을 더 잘 지원하기 위해 네이티브 런타임에 추가되었습니다.

 

사용 중단 및 제거

  • expo-build-properties 필드 enableProguardInReleaseBuilds는 enableMinifyInReleaseBuilds를 위해 사용 중단되었습니다.
  • **React Native의 **<SafeAreaView> 컴포넌트가 사용 중단되었습니다: 아직 사용하지 않고 있다면 대신 react-native-safe-area-context를 사용하세요. 훨씬 더 강력한 대안이며, 거의 모든 앱이 사용하는 라이브러리 중 하나입니다.
  • **앱 설정의 **notification 구성 필드는 expo-notifications 설정 플러그인을 위해 사용 중단되었습니다.
  • expo-av는 SDK 55에서 제거됩니다. SDK 53에서 사용 중단되었으며, 이번이 SDK의 일부가 되는 마지막 SDK 릴리스입니다. expo-audio와 expo-video로 마이그레이션하세요.

 

Notable breaking 변경사항

  • React Native에서 퍼스트파티 JSC 지원 제거: React Native 0.81은 더 이상 내장 JSC 지원을 제공하지 않습니다 — JSC를 계속 사용하고 싶다면 https://github.com/react-native-community/javascriptcore 를 참조하세요. 참고: 이 커뮤니티 유지 관리 JSC 라이브러리는 아직 설정 플러그인을 제공하지 않으므로, 이를 사용하려면 직접 작성하거나 네이티브 프로젝트를 직접 수정해야 합니다.
  • **Reanimated v4가 **react-native-worklets를 도입하고 New Architecture만 지원합니다. Reanimated 3.x에서 4.x 마이그레이션 가이드를 참조하되, babel.config.js 수정은 건너뛰세요(babel-preset-expo에서 자동으로 처리됩니다). Legacy Architecture를 계속 사용해야 한다면, Reanimated v3를 계속 사용할 수 있습니다 — SDK 54에서 Reanimated v3를 사용하는 방법을 알아보세요.
  • metro@0.83에서 내부 Metro import가 변경되었습니다. metro/src/..에서 내부 요소를 가져오는 것은 더 이상 지원되지 않습니다. 내부 요소는 이제 metro/private/..를 통해서만 접근할 수 있습니다. 대부분의 앱 개발자에게는 영향을 주지 않을 것입니다. Metro와 직접 상호작용하는 라이브러리나 앱을 유지 관리한다면 Metro의 공개 API로 전환하세요. src import로 인해 오류가 발생하는 라이브러리를 사용한다면 해당 라이브러리의 GitHub 이슈에 문제를 제기하세요.
  • **expo-file-system legacy API가 이제 **expo-file-system/legacy를 통해 사용할 수 있고, 라이브러리의 기본 export가 이전의 expo-file-system/next로 교체되었습니다. 업그레이드하고 앱이 이전과 동일하게 작동하도록 하는 가장 빠른 방법은 expo-file-system의 모든 import를 expo-file-system/legacy로 교체하는 것입니다. 그 다음, 자신의 속도에 맞춰 새 API로 마이그레이션할 수 있습니다. 이미 expo-file-system/next를 사용하고 있었다면 대신 expo-file-system으로 import를 업데이트하세요(기존 import는 여전히 작동하지만 경고를 받을 것입니다). SDK 55에서 expo-file-system/legacy를 제거할 계획입니다. 새 API에 대해 자세히 알아보기.
  • expo-notifications 사용 중단된 함수 export가 expo/expo#38782에서 제거되었습니다.
  • @expo/vector-icons 아이콘 패밀리가 react-native-vector-icons의 최신 버전으로 업데이트되었습니다. 프로젝트에서 TypeScript를 사용한다면 업그레이드 후 프로젝트를 타입체크하여 사용하는 아이콘 중 이름이 변경되거나 제거된 것이 있는지 확인하세요.
  • 앱 설정의 locales 구성 필드가 이제 Android와 iOS를 모두 지원합니다. iOS 전용 번역 문자열을 locales.ios 키 아래로 이동하세요.

 

도구 버전 업데이트

  • 최소 Xcode 버전이 16.1로 상향되었습니다. Xcode 26이 권장됩니다.
  • 최소 Node 버전이 20.19.4로 상향되었습니다.

알려진 이슈들

  • **iOS용 사전 컴파일된 React Native는 **use_frameworks!와 호환되지 않습니다. use_frameworks!를 사용할 때는 iOS용 React Native가 항상 소스에서 빌드됩니다.
  • 이슈를 발견하셨나요? 신고해주세요.

 

➡️ 앱 업그레이드 Expo SDK 53에서 54로 앱을 업그레이드하는 방법입니다:

  • EAS CLI의 최신 버전으로 업데이트하세요 (사용하는 경우): 복사 npm i -g eas-cli
  • 모든 종속성을 SDK 54에 맞게 업그레이드하세요: 복사 npx expo install expo@^54.0.0 --fix
  • **package.json에 **resolutions/overrides가 있다면 여전히 필요한지 확인하세요. 예를 들어, 이전 SDK 릴리스에서 expo-router를 위해 추가한 metro와 metro-resolver override는 제거해야 합니다. 또한 이전에 monorepo에서 잘 작동하도록 metro.config.js를 구성했다면, 변경이 필요한지 확인하기 위해 업데이트된 monorepo 작업 가이드를 읽어보는 것을 권장합니다.
  • 알려진 이슈 가능성을 확인하세요: 복사 npx expo-doctor@latest
  • 앱에 가장 큰 영향을 줄 가능성이 있는 주요 변경사항은 위의 "사용 중단, 이름 변경 및 제거" 섹션을 참조하세요.
  • 다른 모든 주요 변경사항은 changelog반드시 확인하세요!
  • 필요시 Xcode를 업그레이드하세요: 네이티브 iOS 프로젝트를 컴파일하려면 Xcode 16.1 이상이 필요합니다. SDK 54에는 Xcode 26을 권장합니다. EAS Build와 Workflows의 경우, image가 지정되지 않은 프로젝트는 기본적으로 Xcode 26을 사용합니다.
  • Continuous Native Generation을 사용하는 경우:
    • 로컬 프로젝트 디렉토리에서 이전 SDK 버전용으로 생성한 androidios 디렉토리를 삭제하세요. 다음에 npx expo run:ios, npx expo prebuild 또는 EAS Build로 빌드를 실행할 때 다시 생성됩니다.
  • Continuous Native Generation을 사용하지 않는 경우:
    • ios 디렉토리가 있다면 npx pod-install을 실행하세요.
    • 네이티브 프로젝트 업그레이드 도우미에서 관련 변경사항을 적용하세요.
    • 선택적으로, 향후 더 쉬운 업그레이드를 위해 prebuild 사용을 고려해볼 수 있습니다.
  • expo-dev-client와 함께 개발 빌드를 사용하는 경우: 업그레이드 후 새로운 개발 빌드를 생성하세요.
  • Expo Go를 사용하는 경우: 개발 빌드로 마이그레이션하는 것을 고려하세요. Expo Go는 프로덕션 앱의 개발 환경으로는 권장되지 않습니다.
  • 문제가 있나요? SDK 업그레이드 문제 해결 가이드를 참조하세요.
  • 질문이 있나요? 매주 수요일 태평양 시간 오후 12:00에 Discord에서 진행되는 주간 오피스 아워에 참여하세요.

 

 

 

 

반응형

'REACT & NODE' 카테고리의 다른 글

directly 'pod install' deprecated, rosetta2, intell x86 vs arm64  (0) 2025.09.17
.env  (0) 2025.09.17
React Native 0.79 and Expo 53  (2) 2025.07.02
React 19 and Next.js 15  (0) 2025.05.01
React 19 (Next.js 15) 의 새로운 훅 use  (0) 2025.04.29

댓글

Designed by JB FACTORY