Integrate Expo and React Native into existing native apps

This skill guides integrating Expo and React Native into an existing native iOS or Android app - a brownfield app that adopts React Native incrementally, as opposed to a greenfield app that is React Native from day one. It distinguishes two distinct approaches Expo supports for brownfield integration. The isolated approach ships a prebuilt AAR or XCFramework to the native app, letting the native team consume React Native as a regular library dependency without installing Node, Yarn, or any React Native build toolchain, and suits teams where RN code and native code live in separate repositories or release on independent cadences. The integrated approach instead adds React Native sources directly into the existing Gradle and CocoaPods build, suiting a single team that owns both the native and RN code, is comfortable with RN tooling, and wants hot reload and JS source maps working seamlessly inside the existing native build process rather than a separate build pipeline.

Quick selection rules point toward isolated when the iOS or Android team must consume RN as a library dependency without installing the RN toolchain, or when RN and native code are versioned and released independently, and point toward integrated when one team owns everything and wants a single unified build with working hot reload. For anything ambiguous, a full decision matrix with detailed trade-offs and scenario mapping lives in a dedicated comparison reference. Further references cover building RN as an AAR or XCFramework and consuming it via BrownfieldActivity, ReactNativeViewController, or ReactNativeView for the isolated path; adding RN and Expo directly to existing Gradle and CocoaPods builds via ReactActivity, RCTRootView, and Podfile for the integrated path; and a troubleshooting reference covering Metro connection, build, signing, and module-resolution issues common to both approaches.

Both approaches require Node.js LTS to run the Expo CLI and JavaScript code, and Yarn to manage JavaScript dependencies, in whichever environment builds the React Native side. The integrated approach additionally requires CocoaPods on iOS, while the isolated approach requires no CocoaPods or RN tooling at all in the consuming native app. Expo SDK 55 is the minimum supported version for brownfield integration, since earlier SDKs lack the expo-brownfield package, the required ExpoReactHostFactory and ExpoReactNativeFactory entry points, and the current autolinking surface - so the Expo project must be created with the SDK explicitly pinned to that version, and the same Expo SDK version must be pinned consistently across both the RN project and any embedded dependencies.

Use it when embedding React Native in an existing native iOS or Android app, choosing between AAR/XCFramework and integrated Gradle/CocoaPods approaches, or troubleshooting brownfield-specific build and Metro connection issues. Not for greenfield apps that are React Native from the start.

Given an existing native iOS or Android codebase, it produces a chosen integration approach - isolated AAR/XCFramework or integrated Gradle/CocoaPods build - along with the specific setup steps, prerequisites, and SDK version pin required for that path.

Gradle and CocoaPods native build systems, the Expo CLI, Node.js and Yarn, and Expo SDK 55's expo-brownfield package with its ExpoReactHostFactory and ExpoReactNativeFactory entry points.

Native iOS and Android teams incrementally adopting React Native inside an existing app, who need to choose and correctly set up either an isolated library-consumption approach or a fully integrated build.