React Nativeを0.62に上げる時に辛かったこと

JavaScript, React

ちょっと辛かったので備忘録

環境

  • lerna
  • 0.61.4 から 0.62.0 へ

アップグレード

upgrade-helper を使うと、指定したバージョンからの差分が出せるので、頑張る。
https://react-native-community.github.io/upgrade-helper/

Android の問題

Super expression must either be null or a function

@expo/react-native-action-sheetを使用するライブラリでエラーが発生。
原因はこのライブラリが TouchableOpacity を継承しているため。

@expo/react-native-action-sheet

export default class Base extends TouchableOpacity

現在、元のライブラリは修正済み。
これに依存する一部のライブラリは、 fork されたものを使うか対応待ち。

最悪 patch-package で直す。
https://github.com/ds300/patch-package

iOS の問題

Undefined symbols for architecture x86_64

iOS の Build に失敗する。 FlipperClientが原因っぽい。

ここまでの手順だけでは Xcode の設定が不十分なので、以下のガイドに従う。
https://github.com/react-native-community/upgrade-support/issues/13

補足として、 Bridging-Header ファイルは Tests フォルダの中でも必要だった。
ios フォルダ内に YourProject-Bridging-Header.h と YourProjectTests-Bridging-Header.h があれば OK 。
また、ガイドでは空の Swift ファイルを消すように書かれているが、残しておく。
消してしまった場合は、↓ の内容で作成

yourProject/ios/Dummy.swift

import Foundation

これでも動かない。
Xcode の build settings で GCC_PREPROCESSOR_DEFINITIONS を検索して、 FB_SONARKIT_ENABLED=1 フラグを追加する必要がある。
手動で追加する場合は、 project.pbxproj の /* Debug */ の項目に ↓ を追加。

yourProject/ios/yourProject.xcodeproj/project.pbxproj

// (/* Debug */の中のbuildSettings)
buildSettings = {
    // なんか他の設定
    GCC_PREPROCESSOR_DEFINITIONS = (
	    "DEBUG=1",
	    "$(inherited)",
	    "FB_SONARKIT_ENABLED=1", // これ
    );
    // なんか他の設定
}

まだ動かないので、build settings から、 Debug の DEAD_CODE_STRIPPING を YES にする。
手動で追加する場合は ↓

yourProject/ios/yourProject.xcodeproj/project.pbxproj

// (/* Debug */の中のbuildSettings)
buildSettings = {
    // なんか他の設定
    DEAD_CODE_STRIPPING = YES; // これ
    // なんか他の設定
}

これで動くはず。

0.63 以降

追加した FB_SONARKIT_ENABLED=1 を全て消さないと Xcode でビルドエラーとなる。

まとめ

0.62 から upgrade-support という相談所ができたので、ここの Issue を漁るのが良さそう。

カテゴリー