expo-brownfield
このスキルは、既存のネイティブiOSまたはAndroidアプリにExpoとReact Nativeを統合し、「ブラウンフィールド」開発モデルをサポートします。分離型（AAR/XCFramework経由）と統合型の2つのアプローチを提供し、チーム構成や技術スタックに基づいて最適な方法を選択できます。これにより、React Nativeモジュールをネイティブプロジェクトにスムーズに組み込み、開発効率を大幅に向上させます。
npx skills add https://github.com/expo/skills --skill expo-brownfieldBefore / After 効果比較
1 组標準化されたツールがない場合、既存のネイティブアプリにReact Nativeを手動で統合するには、環境設定、依存関係管理、ビルドシステムの互換性問題に対処するために多大な時間を要し、通常は数日または数週間の開発作業が必要です。
Expo Brownfieldが提供する分離型または統合型のアプローチにより、React Nativeの組み込みプロセスが大幅に簡素化されます。特に分離型アプローチでは、ネイティブチームはNode.jsやReact Nativeのツールチェーンに関する深い知識を必要とせず、統合と設定にかかる時間を劇的に短縮できます。
Expo Brownfield
A brownfield app is an existing native iOS or Android app that adopts React Native incrementally, as opposed to a greenfield app that is React Native from day one.
Expo supports two distinct ways to add React Native to a brownfield project:
| Approach | What ships to the native app | When to choose |
|---|---|---|
| Isolated | Prebuilt AAR / XCFramework | Native team doesn't need Node or RN tooling; RN code can live in a separate repo |
| Integrated | React Native sources added to the existing Gradle / CocoaPods build | One team owns everything; comfortable with RN tooling; wants a single build |
For the full decision matrix, see ./references/comparison.md.
Pick an approach
Use these quick rules — fall through to comparison.md for anything ambiguous.
- Choose isolated if the iOS/Android team must consume RN as a regular library dependency (AAR or XCFramework), without installing Node, Yarn, or the React Native build toolchain.
- Choose isolated if RN code and native code live in separate repositories or release on independent cadences.
- Choose integrated if a single team owns both the native and RN code and is willing to add React Native + Expo to the native project's Gradle and CocoaPods setup.
- Choose integrated if you want hot reload and JS source maps to work seamlessly inside the existing native build process.
References
- ./references/brownfield-isolated.md -- Build RN as AAR/XCFramework and consume from the native app (BrownfieldActivity, ReactNativeViewController, ReactNativeView)
- ./references/brownfield-integrated.md -- Add RN and Expo directly to existing Gradle and CocoaPods builds (ReactActivity, RCTRootView, Podfile)
- ./references/comparison.md -- Decision criteria, trade-offs, and scenario mapping for choosing an approach
- ./references/troubleshooting.md -- Metro connection, build, signing, and module-resolution issues common to both approaches
More information available at https://docs.expo.dev/brownfield/overview/
Shared prerequisites
Both approaches require, in the environment that builds the React Native side:
- Node.js (LTS) — runs the Expo CLI and JavaScript code.
- Yarn — manages JavaScript dependencies.
The integrated approach additionally requires CocoaPods on iOS (sudo gem install cocoapods). The isolated approach does not require CocoaPods or any RN tooling in the consuming native app.
Versioning note
Expo SDK 55 is the minimum supported version for brownfield integration. Earlier SDKs lack expo-brownfield, the required ExpoReactHostFactory / ExpoReactNativeFactory entry points, and the current autolinking surface. When creating the Expo project, always pin the SDK explicitly:
npx create-expo-app@latest my-project --template default@sdk-55
Pin the same Expo SDK across both the RN project and any embedded dependencies.
ユーザーレビュー (0)
レビューを書く
レビューなし
統計データ
ユーザー評価
この Skill を評価