📱
React Native + ExpoのアプリをXcode 26 Betaでローカル/リモートビルドする
React Native製のアプリはXcode 26でビルドするとiOS 26対応が出来るということですが、ではどうやってXcode 26でビルドするのでしょうか。
リモートビルドの場合
expo.dev でのリモートビルドの場合は、これを参考にすればOK。
eas.json
{
"build": {
"base": {
"ios": {
"image": "macos-sequoia-15.5-xcode-26.0"
}
},
"development": {
...
}
}
}
こんな感じで eas.json を設定しておけば、ビルド時にXcode 26が使われます。
ちなみにビルドコマンドは以下。
$ eas build --profile development --platform ios --no-wait
ローカルビルドの場合
毎回 expo.dev でリモートビルドしていると、キュー待ちの時間はかかるし、無料枠も比較的すぐ使い切ってしまうので、可能ならローカルビルドしたいところ。
ただ調べても、Xcode 26 Betaでローカルビルドする方法が全然分からなかったのですが、色々試していたら以下のやり方でいけました。
DEVELOPER_DIR 環境変数をセットしてビルドする
DEVELOPER_DIR という環境変数を使えばXcodeのバージョンを一時的に切り替えられるらしい。
$ DEVELOPER_DIR=/Applications/Xcode-beta.app/Contents/Developer eas build --profile development --platform ios --local
簡単でした。めでたいですね。
実際に確認
実際にローカルビルドした際のログは以下。
DEVELOPER_DIR なし
[RUN_FASTLANE] +-----------------------------------------------------------------------------+
[RUN_FASTLANE] | Summary for gym 2.228.0 |
[RUN_FASTLANE] +--------------------------------------+--------------------------------------+
[RUN_FASTLANE] | workspace | ./VioletDev.xcworkspace |
[RUN_FASTLANE] | scheme | VioletDev |
[RUN_FASTLANE] | clean | false |
[RUN_FASTLANE] | output_directory | . |
[RUN_FASTLANE] | output_name | VioletDev |
[RUN_FASTLANE] | configuration | Debug |
[RUN_FASTLANE] | silent | false |
[RUN_FASTLANE] | skip_package_ipa | true |
[RUN_FASTLANE] | skip_package_pkg | false |
[RUN_FASTLANE] | skip_archive | true |
[RUN_FASTLANE] | build_path | xxx |
[RUN_FASTLANE] | derived_data_path | ./build |
[RUN_FASTLANE] | result_bundle | false |
[RUN_FASTLANE] | buildlog_path | /xxx/logs |
[RUN_FASTLANE] | destination | generic/platform=iOS Simulator |
[RUN_FASTLANE] | suppress_xcode_output | true |
[RUN_FASTLANE] | xcodebuild_formatter | xcpretty |
[RUN_FASTLANE] | build_timing_summary | false |
[RUN_FASTLANE] | disable_xcpretty | true |
[RUN_FASTLANE] | skip_profile_detection | false |
[RUN_FASTLANE] | xcodebuild_command | xcodebuild |
[RUN_FASTLANE] | skip_package_dependencies_resolutio | false |
[RUN_FASTLANE] | n | |
[RUN_FASTLANE] | disable_package_automatic_updates | false |
[RUN_FASTLANE] | use_system_scm | false |
[RUN_FASTLANE] | xcode_path | /Applications/Xcode.app |
[RUN_FASTLANE] +--------------------------------------+--------------------------------------+
DEVELOPER_DIR あり
[RUN_FASTLANE] +-----------------------------------------------------------------------------+
[RUN_FASTLANE] | Summary for gym 2.228.0 |
[RUN_FASTLANE] +--------------------------------------+--------------------------------------+
[RUN_FASTLANE] | workspace | ./VioletDev.xcworkspace |
[RUN_FASTLANE] | scheme | VioletDev |
[RUN_FASTLANE] | clean | false |
[RUN_FASTLANE] | output_directory | . |
[RUN_FASTLANE] | output_name | VioletDev |
[RUN_FASTLANE] | configuration | Debug |
[RUN_FASTLANE] | silent | false |
[RUN_FASTLANE] | skip_package_ipa | true |
[RUN_FASTLANE] | skip_package_pkg | false |
[RUN_FASTLANE] | skip_archive | true |
[RUN_FASTLANE] | build_path | xxx |
[RUN_FASTLANE] | derived_data_path | ./build |
[RUN_FASTLANE] | result_bundle | false |
[RUN_FASTLANE] | buildlog_path | /xxx/logs |
[RUN_FASTLANE] | destination | generic/platform=iOS Simulator |
[RUN_FASTLANE] | suppress_xcode_output | true |
[RUN_FASTLANE] | xcodebuild_formatter | xcpretty |
[RUN_FASTLANE] | build_timing_summary | false |
[RUN_FASTLANE] | disable_xcpretty | true |
[RUN_FASTLANE] | skip_profile_detection | false |
[RUN_FASTLANE] | xcodebuild_command | xcodebuild |
[RUN_FASTLANE] | skip_package_dependencies_resolutio | false |
[RUN_FASTLANE] | n | |
[RUN_FASTLANE] | disable_package_automatic_updates | false |
[RUN_FASTLANE] | use_system_scm | false |
[RUN_FASTLANE] | xcode_path | /Applications/Xcode-beta.app |
[RUN_FASTLANE] +--------------------------------------+--------------------------------------+
一番最後の xcode_path の箇所が、ちゃんと /Applications/Xcode-beta.app になっています。
アプリの表示
参考までに、iOS 26のことを何も考慮しないで実装したアプリをビルドした際の見た目です。
Xcode.app (16.4) でビルド
Xcode-beta.app (26 Beta) でビルド
間違い探しみたいになっていますが、 Xcode 26 Beta でビルドして iOS 26 Simulatorで起動したアプリは、ナビゲーションバー部分 (@react-navigation/native で実装) がiOS 26の見た目になっています。
ここから各UIをiOS 26対応 / Liquid Glass対応したりすれば良さそうです。
Discussion