LoginSignup
16
7

More than 1 year has passed since last update.

@goosys

2021年版 Expoまとめ

Last updated at Posted at 2022-02-17

  • Expoのここ３年くらいの動きが慌ただしかったため、用語整理も兼ねてまとめる

Expoのリリース履歴

SDK Date Highlight
33 2019/6 Bare Workflow
Expo Web(React Native Web)ベータ版
34 2019/7 Android App Bundle(.app)をサポート
35 2019/9 iOS13をサポート
36 2019/12
37 2020/4
38 2020/6 ExpoKit終了
39 2020/9 iOS14をサポート
40 2020/12
41 2021/4 EAS Build,EAS Submit提供開始
AndroidR(11/SDK30)をサポート
iOS10を除外
42 2021/7 expo-dev-clientのpreview release
43 2021/10 iOS15をサポート
iOS11を削除
44 2021/12

動きを大まかにまとめると、

クラウドビルド

  • expo.ioによるクラウドビルドによって、アプリ開発環境をローカルに構築しなくてもリリースビルドまで作れてしまう機能を早くから提供していた
    • ※ただし、アプリストアへのリリースは、ビルドを手でDLして手で上げにいく形だった
  • ※いつの間にかドメインが expo.dev に変わっていた
  • リリースに必要なAndroid/Appleの証明書等はexpo.io上に預けておくことができる
    • 以前はexpo.ioにログインしても預けた証明書等を見ることはできなかったが、2021年のEAS Submitリリースに合わせて管理画面も刷新し証明書の閲覧や更新が画面上で出来るようになった
  • （記憶違いかもしれないが）Organizationアカウントにメンバーを招待することができたが、以前はeas buildを実行するときにログインするユーザーはオーナーアカウントではなくてはならず、チーム開発しにくかった
    • いつのまにか app.jsonにownerの項目 が出来ていて、organizationに招待されていればメンバーのアカウントでもコマンドが使えるようになっており、チーム開発もしやすくなった

リリースサイクル、SDKバージョン

  • ２年ほど前に今後のリリースサイクルが発表され、3カ月ごとに年4回リリースされることになった
    • 直近は2021/12にSDK44がリリースされた
    • 予定通りだと2022年は45,46,47,48がリリースされるはず
  • 最新バージョンから数えて４バージョンしかサポートされない
    • サポートが外れたバージョンはExpo Goでビルドできない

ネイティブコード

  • 非常にややこしい話だが、ReactNativeを使っているはずのExpo SDKで開発したアプリでもReactNativeのネイティブ部分を自由に扱うことはできなかった
    • サードパーティのReactNativeモジュールをインストールしてもネイティブコードの修正部分をアプリに反映することができないため正常な動作とならず、利用できるモジュールは限定的だった
    • ※GoogleAnalyticsのReactNative SDKなどを入れても何も送信されることはなかった
  • また、Expo SDKで利用しているReactNativeはExpo用のForkプロジェクトであり純粋なReactNativeではなかった（Expo42まで）

Bare Workflow

  • SDK33より Bare Workflow が登場した
    • $ expo eject コマンドを実行することで、ios/ android/ フォルダにネイティブコードが生成されるというものだった
    • 生成されたフォルダはXcodeやAndroid Studioでそのまま開くことができ、これによりネイティブコードも好きにいじれるようになった
      • その反面、Expoの恩恵には与れなくなり、アイコン類の自動生成、Expo Goでの実行、クラウドビルド、証明書の管理、PUSH通知 など多くの機能が手作業実装となり手間が増えた
      • Expo SDKのバージョンアップ後にもネイティブ側への必要な修正を手作業で行う必要があり非常に手間であった
  • Bare Workflowが登場したことで従来のexpo.ioを用いた開発方法は Managed Workflow と呼ばれるようになった

Managed Workflow in 2021

  • Expo managed workflow in 2021 - Apr 22, 2021
  • 2021年4月のSDK 41より、新しいビルド方法による開発フローが利用できるようになった
  • EAS Build によりネイティブコード生成を含むビルドもクラウドビルドすることが可能となった
  • また、ビルドだけではなくストアへのリリースまでサポートすることが発表された (EAS Submit)
  • EAS は Expo Application Services の略

Automatic TypeScript setup

  • SDK 41で発表されていた
    • ※見逃していたため未検証
    • tsconfig.jsonだけ作って普通にrunするとTypescriptにコンバートしてくれるらしい？

Expo Goとexpo-dev-client

  • Expo Go (後にExpo Clientに改称) はAndroid/iOSのアプリとして提供されており、開発環境でビルドしたReactNativeのJSバンドルをアプリに転送し実行する仕組みだった
    • ここが「アプリ開発環境がなくても開発できる」というExpo最大の見せ場であった
    • アプリ自体は既に完成したものを利用しているため、当然ながらネイティブ部分にアクセスするような開発はできなかった
  • 新しく登場した expo-dev-client (Custom Development Clients?) では、Android/iOSのプロジェクトソースを自動生成しアプリそのものをその場でビルドしてしまうことができるようになった
    • expo-dev-client利用時のExpo Goはランチャー程度の役割しかないので、あってもなくてもよい（はず）
  • その代わり、ローカルでビルドする場合はそれなりにAndroid/iOSの開発環境が必要になった
    • ※この点はEAS Buildで解決する（後述）
  • アプリそのものをビルドすることができるので、全てのReactNativeのサードパーティモジュールが動作するようになった
  • ネイティブプロジェクトのソースは自動生成なため、Expo SDKのバージョンアップ時にもBare Workflowのときのような手作業をしなくてよくなった
  • $ expo prebuild コマンドでネイティブプロジェクトのソースが生成される（アプリビルドは行われない）ため、生成されるソースの確認やXcodeでのデバッグなども行うことができる

Config Plugins

  • ネイティブプロジェクトのソースを個別に編集せずにアプリの設定をカスタマイズできるように、Config Pluginsが提供されている
  • Info.plist の特定部分を書き換えたり、entitlements に設定を追加したりできる
  • withDangerousMod を使えばかなり危険な書き換えもできる（未検証）

EAS Build

  • EAS Build — February Preview Update - Feb 19, 2021
  • expo.dev上のクラウドビルドが新しいビルド方法で行われるようになった
    • ※従来のexpo buildコマンドでのビルドの履歴は「Type: Classic」と表示されるようになった
  • eas.json でビルド設定を書けるようになった
    • 証明書を切り替えたり、ビルドイメージを指定できたりする
    • 環境変数的なものも設定できる
  • ビルド前後にhookを動作させることができるようになった
  • クラウドビルド用のシークレットも預けておけるようになった
  • 生成されるバイナリ容量が1/10程になった
    • ※今まで単純なWEBVIEWアプリでも80MBになったりしていたが、不要なコードが含まれなくなったため10MB以下になることも普通になってきた
  • 開発用に（expo-dev-clientを有効にして）ビルドしたアプリはローカル開発に利用できる
    • ※（従来のExpo Goのように）アプリの開発環境のないマシンでも、 EASでビルドした開発用アプリをスマホに入れてPCで $ yarn start --dev-client してQRを読み込めば開発ができる
      • ※ただし、ネイティブ部分を変更したい場合はアプリの再ビルドが必要

EAS Submit

最新版(SDK43)でのリリースフロー

MatchaNote2021-Architecture-Expo.drawio.png

  • 諸々設定済みであれば $ eas build -p all --non-interactive --auto-submit と打って待っていれば諸々自動的に動いてくれる
    • Androidはどこに出すかを選べる（内部テスト・クローズドテスト・オープンテスト）
    • リリースノートやリリースのバージョン名を書き換える機能は今のところは無さそう
  • 図では省略したが、ビルド時のHookで各サービスとの連携もできるのでいろいろ便利に使える
    • 各所（Slackなど）に通知したり
    • AmplifyをpullしてGraphQLをビルドしたり
    • google-services.json をSecret化しておいてビルド前にファイルに戻したり
  • こちらも省略したが、PUSH通知用のKEY類も預けておけてExpo経由で通知できる機能も健在

Bare Workflowで作ったアプリをManaged Workflowに戻せるか

  • 戻せる（実績あり）

まとめ

  • 今後は、Managed Workflow＋EAS Build＋EAS Submitが推奨されていくのだと思う
16
7
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
16
7