トップ/記事一覧

Expo アップデートのメモ(Expo 44 → 45 React Native 0.64 → 0.68)

📆2022/07/12🔖 React NativeExpo

個人開発している Fast Notion という iOS / Android アプリで、Expo と React Native のアップデートを実施したのでそのメモ。Bare Workflow なので、Expo と React Native のアップグレードをそれぞれ実施した。

ちなみに前回のアップデートのログはこちら。

https://blog.35d.jp/2021-07-26-expo-sdk-update

基本的には Expo 側がマイグレーションガイドを準備してくれているので、それに沿って作業を勧めていけば良い。

https://docs.expo.dev/workflow/upgrading-expo-sdk-walkthrough/

アップデートコマンドを叩く

expo upgrade コマンドを叩く。自分で package.json のライブラリのバージョンを上げなくても、CLI でよしなにバージョンアップをやってくれる。

JavaScript

u@Mac-mini fast-notion % expo upgrade Your git working tree is clean To revert the changes after this command completes, you can run the following: git clean --force && git reset --hard ✔ You are currently using SDK 44.0.0. Would you like to update to the latest version, 45.0.0? … yes ✔ Installed expo@^45.0.0 ✔ Validated configuration. ✔ No additional changes necessary to app.json config. ✔ Updated known packages to compatible versions. ✔ Cleared packager cache. ✔ Validated project 👏 Automated upgrade steps complete. ...but this doesn't mean everything is done yet! ✅ The following packages were updated: expo-clipboard, expo-analytics-amplitude, @react-native-async-storage/async-storage, expo-constants, expo-asset, react-native-webview, @expo/vector-icons, react-native-web, react-dom, expo-store-review, expo-web-browser, expo-ads-admob, react-native-gesture-handler, react-native-svg, expo-haptics, react, react-native-screens, expo-splash-screen, react-native, expo-font, expo-in-app-purchases, react-native-safe-area-context, expo-linking, jest-expo, jest, typescript, @babel/core, @types/react, @types/react-native, expo 🚨 The following packages were not updated. You should check the READMEs for those repositories to determine what version is compatible with your new set of packages: @react-navigation/bottom-tabs, @react-navigation/native, @react-navigation/native-stack, axios, moment, zod, babel-plugin-module-resolver, react-native-svg-transformer, react-test-renderer Please refer to the release notes for information on any further required steps to update and information about breaking changes: https://blog.expo.dev/expo-sdk-45-f4e332954a68

廃止されたライブラリの確認と置き換え

expo 周りで廃止されたライブラリがあるので、別のライブラリに置き換えたりする作業をおこなう。以下のブログ記事に廃止ライブラリと代替ライブラリが載っているので、該当するものがないか確認して、置き換え作業を実施した。

https://blog.expo.dev/expo-sdk-45-f4e332954a68

React Native 側のコード書き換え

React Native の upgrade helper を見て、差分を見て愚直にコードを書き換えていく。これが一番ツライ作業。慎重に手作業でコピペしていく。1時間程度で完了。

https://react-native-community.github.io/upgrade-helper/?from=0.64.2&to=0.68.2

作業が完了したら、node_modules と podfile 群を最新にアップグレードして、アプリケーションを起動。ビルドが通ったら成功。

エラー①:TypeError: undefined is not an object (evaluating 'Object.keys(viewManagersMetadata)')

解決していない。iOS / Android のランタイムで発生。console.log で吐き出している部分なので、ライブラリ内のコードを書き換えてビルドを通したが、根本原因は分かっていない(誰か分かる方いたら教えて下さい)

https://github.com/unimodules/react-native-unimodules/issues/142

エラー②:Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8

手元のマシンに Java11 をインストールして、パスを通した。以下の Issue を参考にした。

https://github.com/facebook/react-native/issues/33416

🐈

これで無事 iOS と Android のビルドが通った。気合い。