さて、アプリは作成できたとして、いざビルドしようとしたところ、Androidプログラミングと違って、いろいろエラーが出るわ出るわでした。
人によって違うかとは思いますが、Exp44での話と、Exp49(現在最新バージョン)での話を書かせてもらいます。EAS buildで躓いている方の一助になればと思います。
まず、Expo44の話です。
現在のスマホ側のExpo goアプリは普通にGoogle Play storeからダウンロードすると、Exp46以上しか対応していません。
このため、下記の方法をとっています。
①Android Studioをダウンロード、インストールし、Android SDKをPCに入れることで、SDKのplatform-toolsにパスを通しておくことで、その中のabdコマンドが使用でき、それを用いて、スマホとUSBケーブルをつなぎます。
②スマホの中に通常のGoogle play storeから入れたExpo goがあればアンインストールしておく必要があります。
③スマホを開発者オプションを有効にし、USBデバックを許可します。
④VScodeのターミナルで npm start とします。
⑤ そのあと a コマンドで android studioを立ち上げます。後は自動で行われます。
では、EASビルドしたときの経験したエラーと解決のヒントを記載します。
その前にエラーに対する対処の一般知識が必要です。下記のYoutube動画のエラーの対処のところが簡単で有用です。
プログラミングスキルが高い人の4つの特徴!スキルを高める方法も紹介 - YouTube
それでは、エラーについて例をあげていきます。
<エラーの1例>
[stderr]
While resolving: @react-native-community/masked-view@0.1.10
[stderr]
npm ERR! Found: react@17.0.1
[stderr]
npm ERR! node_modules/react
[stderr]
npm ERR!
[stderr]
react@"17.0.1" from the root project
[stderr]
npm ERR! peer react@"*" from @react-navigation/bottom-tabs@5.11.15
・・・①
[stderr]
npm ERR! node_modules/@react-navigation/bottom-tabs
[stderr]
npm ERR! @react-navigation/bottom-tabs@"^5.11.0" from the root project
・・・①’
[stderr]
npm ERR! 13 more (@react-navigation/core, @react-navigation/native, ...)
[stderr]
npm ERR!
[stderr]
npm ERR! Could not resolve dependency:
[stderr]
npm ERR! peer react@"^16.0" from @react-native-community/masked-view@0.1.10
・・・②
[stderr]
npm ERR! node_modules/@react-native-community/masked-view
[stderr]
npm ERR! @react-native-community/masked-view@"0.1.10" from the root project
[stderr]
npm
[stderr]
ERR! peer @react-native-community/masked-view@">= 0.1.0" from @react-navigation/stack@5.14.9
[stderr]
npm ERR! node_modules/@react-navigation/stack
[stderr]
npm ERR! @react-navigation/stack@"^5.12.5" from the root project
[stderr]
npm ERR!
[stderr]
npm ERR! Conflicting peer dependency: react@16.14.0
[stderr]
npm ERR! node_modules/react
[stderr]
npm ERR! peer react@"^16.0" from @react-native-community/masked-view@0.1.10
[stderr]
npm ERR! node_modules/@react-native-community/masked-view
[stderr]
npm ERR! @react-native-community/masked-view@"0.1.10" from the root project
[stderr]
npm ERR! peer @react-native-community/masked-view@">= 0.1.0" from @react-navigation/stack@5.14.9 ・・・③
[stderr]
npm ERR! node_modules/@react-navigation/stack
[stderr]
npm ERR! @react-navigation/stack@"^5.12.5" from the root project
よくわからないが、bottom-tabsライブラリのバージョンを書いてあるものに上げたほうが、すべてのreactに対応できるということを言いたいらしい
→解決として、5.11.15に上げました。
②→今のmasked-view@0.1.10ライブラリだとreact@16と対応とのことらしい。
解決として、0.1.11に上げました。
③→masked-viewライブラリの0.1以上のバージョンを使用するなら、@react-navigation/stackは 最低、@5.14.9にはしておきなさいということらしい
→5.14.9に上げました。
ちなみに、React Nativeは、0.64.3です。
これでビルドできました。
Expo49での話に移ります
<エラーの1例>
[stderr]
FAILURE: Build failed with an exception.
[stderr]
* What went wrong:
[stderr]
Execution failed for task ':expo-splash-screen:compileReleaseKotlin'.
[stderr]
> A failure occurred while executing org.jetbrains.kotlin.compilerRunner.GradleCompilerRunnerWithWorkers$GradleKotlinCompilerWorkAction
[stderr]
> Compilation error. See log for more details
このエラーは有名だそうで、React Nativeのバージョンが 0.71.0以上の際に起こるので、それに対するパッチ記述の追記でエラーが解消されます。
node_modulesフォルダ内のexpo-modules-coreのandroidフォルダ内のbuild.gradleファイルに追記します。(androidフォルダは、expoにもありますが、こちらではないです)下記が追記例です。わかりにくいといけないので、前後すべて貼り付けてますが、追記するのは、①と②です。