「基礎から学ぶReact Native入門」の感想・備忘録4

スポンサーリンク

reactやreact-nativeには.d.tsファイルが同梱されていないが、@types/reactや@types/react-nativeがMicrosoftによってメンテナンスされている。

環境構築

npx create-expo-app --template
※Blank (TypeScript)を選択

npx tscで型チェック実行

Android

GooglePlayにapkまたはaabファイルをアップロードする。

  1. GooglePlayに開発者として登録(初回のみ25ドル必要)
  2. Play Consoleで掲載情報を入力
  3. Play Consoleでファイルをアップロード

iOS

App Storeにipaファイルをアップロードする。

  1. Apple Developer Programに登録(年99ドル)
  2. デベロッパーアカウントサービスでAppleIDを登録
  3. App Store Connectで掲載情報を入力
  4. 審査
  5. App Store Connectでアプリをアップロード
  • Expoであれば、Android SDKもiOS SDKも必要ない。
    これはExpoのクラウドサービスexpo.ioがリリースビルドのためのサーバーを提供することで実現されている。
    (サーバへ設定ファイル(app.json)、ソースコード、画像・音声などをアップロードし、アプリファイルがダウンロードされる)

設定

app.jsonのexpoキーに以下を設定することができる。

  • アプリ名: nameで指定
  • アプリID: ios.bundleIdentifierとandroid.pakageで指定
    ドメイン名の逆順。
    iosはハイフン可アンスコ不可、androidはハイフン不可アンスコ可なので注意
  • バージョン(ストア表記用): versionで指定
  • 内部バージョン(内部での管理用): ios.buildNumberとandroid.versionCodeで指定
    ※ buildNumberはstring型だが数値とドットのみ使えるので、事実上はversionCodeと同じ値の数字文字列を指定することになる
    ※ アップするたびにより大きい数にしなければならない
  • アイコン: iconで指定
    ※ androidではAdaptive Iconの提供が推奨されている。
    android.adaptiveIcon.foregroundImageで指定する。
  • スプラッシュ画面: splash.imageで指定
    splash.resizeModeをcoverにすると画面いっぱいに広がり、containsにすると画面内に収まるように縮小される。

ビルドの実行

書籍内ではexpoコマンドを使っているがExpoバージョン47以降は使用不可になっているため、ここではeasコマンドを使う。

手順

  1. npm install -g eas-cli
  2. eas login
  3. eas build:configure
  4. eas build --platform all
    [OS指定の場合]
    eas build --platform android
    eas build --platform ios

コメント