React Nativeのバージョンアップ時にやっていること

何度かReact Nativeアプリのバージョンアップを経験して、ある程度バージョンアップ手順が自分の中で固まってきたので公開します。

2023/01/10追記

upgrade-helperを使うと任意のバージョンから任意のバージョンに変更するために必要な差分を確認することができるのでかなり便利です
https://react-native-community.github.io/upgrade-helper/

React Native自体のバージョンアップ

リリースノートを反映

これが一番大事です。
既存アプリのReact Nativeのバージョンから、最新のReact Nativeのバージョンまでのリリースノートを全て読み、各バージョンアップで必要な作業を全て行います。
リリースノートにはiOSのframeworkの追加やAndroidのビルドSDKのバージョンアップ等の重要な情報が含まれます。
数が増えると大変ですしエラーが大量に出ると心が折れるので、パッチレベルでのバージョンアップでも即座に対応するのがReact Nativeでは大切だと思います。

スケルトンとの比較

これを飛ばして安易にpackage.jsonのreact-nativeのバージョンだけ上げると、エラーたくさんでたりして時間を取られることになります。

やり方はまずreact-native init NewApp で最新のスケルトンアプリを作成します。
基本的にこの最新のスケルトンアプリと、バージョンアップ対象の既存のアプリを比較して必要な変更を適宜取り入れていきます。

package.json

スケルトンアプリのpackages.json と既存アプリの package.json を比較し、依存ライブラリのバージョンアップを行います。
既存に無いものは、それが必要になっているということなので追加します。

build.gradle

android/build.gradle に反映が必要な変更があれば適用します。
特に注意してみるのが ビルドSDKのバージョンと com.android.tools.build:gradle のバージョンです。

android/gradle/wrapper 以下のファイルも変更があればまるっとコピーします。

その他のファイル

プロジェクト直下のその他のファイルを全て目視で確認して変更があれば、必要かあたりをつけて判定します。

• .flowconfig は末尾のバージョンが異なっていたら、まるっとファイルコピーしています。
• .gitignore はプロジェクトで変更している可能性が大きいと思うので、まるっとコピーはせず必要な変更を反映。(変更しなくてもコミット時にわかるからあまり重視しなくてよい)

一度ビルド

React Native自体のバージョンアップが終わったら、 キャッシュを削除 してから、祈りを込めて一度ビルドしてみましょう。
Android/iOSともに正常にビルドできれば動作確認に移ります。
ビルドできなかったら、エラーメッセージをぐぐるなりして解決方法を探します。

既存アプリの依存パッケージのバージョンアップ

React Nativeを最新にしたことで既存アプリが依存しているパッケージがビルドできなくなっている可能性もあります。
各パッケージのGitHubのREADMEやissueを確認し、最新のRNに対応しているバージョンに適宜変更します。
特に情報がない場合は、既存のバージョンのままにしておきます。

※React Nativeの最新にライブラリ側のバージョンが追いついてないこともあります。ちょろっと自前でパッチあてたり、ライブラリのバージョンアップをまったりいろいろな選択があります。

ビルドと動作確認

Android/iOSともに正常にビルドできればテストと動作確認をしてバージョンアップの作業は終了です。

まとめ

手順にすると簡単ですが、これ通りにやってもやはりビルドできないことがあります。
そんな時はGoogle先生に聞いてコツコツ解決していくしかありません。
既存アプリのバージョンと最新のReact Nativeのバージョンの差が大きくなるほどバージョンアップは大変になってきます。
こまめなバージョンアップを心がけましょう。