Expo SDK v33.0.0

Changhoi Kim·2019년 6월 18일
Exporeact native
1
post-thumbnail

Expo SDK v33.0.0 업데이트

지난 6월 6일에는 새로운 Expo SDK가 릴리즈 됐다. 가장 첫 문장이 웹을 지원하는(지금은 베타 버전) SDK라는 것이다. 되게 좋을듯. 또 TypeScript 정의, React Native 0.59.8을 기반으로 한다는 점 (Hooks를 지원함, 그리고 글에는 없지만 아마 이전 SDK가 react-redux 6.x 버전과 호환되던 것을 보완할 것 같다. 안써봤지만 최신 버전의 react-redux와 호환이 가능할 것으로 보임)

Overview

  • Expo Web
  • Custom Expo Clxients
  • Priority Developer Services
  • Bare Workflow
  • Modular Imports
  • TypeScript
  • React Hooks
  • Restricted Background Location
  • Optimize Images with Expo CLI
  • API Improvements and Additions
  • Breaking Changes
  • Upgrading Your App

SDK 30 버전 이하는 지원하지 않는다는 내용은 빼버렸습니다. SDK 30 이하를 사용하시는 분들은 참고하세요.

Expo Web

Expo CLI, SDK를 지원하는 내장 웹이다. Expo 프로젝트를 tri-platform (아마 웹, iOS, Android)로 만들어줄 신기능이란다. 이 기능은 react-native-web을 기반으로 돌아간다고 한다. 현재 모든 모듈이 제대로 돌아가는 건 아니고 여기에서 돌아가고 있는 모듈, 실험적 모듈, 네이티브에서만 돌아가는 것으로 나눠진 리스트를 확인할 수 있다. 예시 및 정보들은 여기에서 확인할 수 있다. 어떻게 생겼는지 한 번 볼려면 아래 코드를 실행하면 된다.

npm i -g expo-cli
expo init test && cd test
expo start -w

Custom Expo clients (iOS)

Expo CLI가 custom Expo client를 만들 수 있다. (development, testing에서 사용) 지금 Expo app에서는 없어진 Background Location이 포함되어 있다. 이 workflow는 Apple Developer account와 사파리를 통해 기기에 앱을 설치할수 있게 해주는 ad-hoc provisioning profiles 기능을 요구한다.
자세한 방법은 여기서 확인 가능하다.

Priority Developer Service

Expo의 새로운 유료 서비스이다. 이번 버전에서 Teams / Priority Builds를 소개했다.

  • Teams: 팀단위가 같은 Expo 프로젝트를 publish 할 수 있게 한다.
  • Priority Builds: standalone build queue 우선순위를 준다.

Bare workflow

안드로이드에서 단일 모듈 설치하는 것이 훨씬 쉬워졌다고 한다. 그냥 npm으로 설치한 다음 rebuild하면 된다고 한다. 잘 안쓰고 있는 부분이기도 하고 모르는 내용들이 있어서 이 정도로 정리한다.

Modular Imports

import { FileSystem } from 'expo';처럼 expo에서 모듈을 임포트하는 것을 deprecating했다. 대신 개별적인 패키지를 설치하고 그 패키지에서 가져와야 한다. 새로운 expo install 이라는 명령어로 모듈들을 설치할 수 있는데, 이 명령은 npm install / yarn add를 감싸고 있고 현재 SDK 버전과 호환이 되는 모듈 버전으로 설치를 하도록 해준다. 위에서 든 예시로 FileSystem을 설치하려면 다음으로 실행해야 한다.

  • expo install expo-file-system;
    이미 expo를 직접 import하는 것으로 사용 중이라면 위 예시처럼 변경을 해줘야 하는데 이러한 변경을 쉽게 해주기 위해서 expo에서는 codemod를 제공한다. 자동으로 import를 업데이트 해주는 도구라고 한다.

TypeScript

SDK 33부터는, Expo의 모듈들(Expo-authored Modules)이 모두 타입스크립트로 바뀐다.App.tsx, tsconfig.json을 제공하는 프로젝트 템플릿 옵션도 만들었다. 이름은 blank (TypeScript)가 될듯

React Hooks

리액트 훅이 지원된다.

Restricted Background Location

iOS Expo Client에서는 Background Location을 제거했다(App Store의 가이드라인 때문이라는듯). 다시 말하자면, 앱에서 Background Location을 사용할 계획이면 Custom iOS Expo client build 또는 standalone app(Expo를 뺀) 또는 안드로이드 Expo client가 필요하다.

API improvements and additions

New APIs

  • Crypto
  • Random
  • Sharing: 다른 앱과 미디어, 파일을 공유할 때 사용되는 함수를 제공함
  • VideoThumbnails: 비디오 파일에서 이미지 썸네일을 만들게 해줌

Haptics and BackgroundFetch on Androida

Haptics와 BackgroundFetch가 원래는 iOS에서만 작동했는데 이제는 안드로이드에서도 쓸 수 있음

Revised modules

Brightness, ScreenOrientation, KeepAwake, WebView가 새로 작성되었다. 웹뷰 잘 만들었다고 소문난 react-native-webview를 가져다 쓴 거라고 한다.

React Native 0.59

RN 버전이 0.59.8로 변경되었다.

Library updates

  • Updated react-native 0.57.1 to 0.59.8
  • Updated react-native-gesture-handler 1.0.12 to 1.2.1
  • Updated react-native-reanimated 1.0.0-alpha.11 to 1.0.1
  • Updated react-native-screens 1.0.0-alpha.19 to 1.0.0-alpha.22
  • Updated react-native-maps 0.22.1 to 0.24.2
  • Updated @expo/vector-icons 9.0.0 to 10.0.1
  • Updated lottie-react-native 2.5.0 to 2.6.1
  • Updated react-native-svg 8.0.10 to 9.4.0
  • Updated react-native-view-shot 2.5.0 to 2.6.0
  • Added react-native-webview 5.8.1
  • Added @react-native-community/netinfo 2.0.10

Breaking Changes

  • 안드로이드에서 splash screen의 작동 방법을 수정했다 resizeMode 옵션에서, cover과 contain 동작 방식을 서로 바꿨다
  • MediaView와 TriggerView 를 삭제했다. AdMediaView, AdTriggerView로 변경해야 한다.
  • Haptic의 이름을 Haptics로 바꿨다. 그리고 모든 함수 이름에 Async를 앞에 달았다
  • IntentLauncherAndroid를 IntentLauncher로 바꿨다. 그리고 startActivityAsync의 signature를 설정 옵션을 더 달게 변경했다.
  • 안드로이드에서 WebBrowser.openBrowserAsync가 커스텀 탭을 열때 resolved된다. (그 전에는 닫을때 resolved 된듯)

Ejected projects

  • @unimodules/core에 UMAppDelegateWrapper를 달았다. unimodule과 AppDelegate 콜백 사이 통합을 쉽게 해준다.
  • expolib_v1을 사용하는 라이브러리들을 Expo Kit에서 모두 제거했다.
  • 안드로이드 Expokit 프로젝트에서 devKernel, prodKernel을 제거했다.

Upgrading Your App

SDK 32.0.0에서 33.0.0으로 업그레이드 하는 방법이다.
1. Expo CLI 서버 닫기
2. app.json에서 sdkVersion을 33.0.0으로 변경
3. package.json에서 의존성을 아래와 같이 변경
- react-native to "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz"
- expo to "^33.0.0"
- react to "16.8.3" — (this exact version)
- react-navigation to "^3.11.0" (if you use it — this is also optional, you don’t have to update it to use the newest SDK. If you choose to, make sure you read the changelog for breaking changes.)
- jest-expo to "^33.0.0" (if you use it)
- sentry-expo to "~1.13.0" (if you use it)
4. node_modules를 삭제하고 npm install or yarn
5. expo start -c
6. Expo app을 업데이트 (시뮬레이터에서는 expo-cli가 알아서 해줌)
7. breaking되는 부분 확인
8. expo를 직접 import 하는 것 변경 (expo-codemod 사용할 수 있음)
9. web support를 달고 싶으면 여기에서 확인

Updating ExpoKit to SDK 33

방법은 여기에서 확인 가능함

전체 원문

profile
Changhoi Kim
이전 포스트

GOF 디자인패턴 #1

다음 포스트

GOF 디자인패턴 #2 Abstract Factory

0개의 댓글