expo-brownfield

Integrate Expo and React Native into existing native iOS and Android apps.

Updated Sep 11, 2026
One-click install
npx skills add https://github.com/CYRUS-pinto/pi-bot --skill expo-brownfield-cyrus-pinto
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: expo-brownfield
Source: https://github.com/CYRUS-pinto/pi-bot/tree/main/.agents/skills/expo-brownfield
Command: npx skills add https://github.com/CYRUS-pinto/pi-bot --skill expo-brownfield-cyrus-pinto

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Adding React Native to an existing native iOS or Android app requires choosing between shipping a prebuilt AAR/XCFramework or embedding React Native sources directly into Gradle and CocoaPods builds, and each path involves intricate configuration that is easy to get wrong. ## Core Features & Use Cases - Isolated approach: Build React Native as a prebuilt AAR or XCFramework (or Swift Package) with expo-brownfield, so native teams consume it as a regular dependency without Node or RN tooling. - Integrated approach: Add React Native and Expo directly to existing Gradle and CocoaPods builds with autolinking, hot reload, and a unified build pipeline. - Decision guidance and troubleshooting: A comparison reference maps team structures and constraints to the right approach, and a troubleshooting guide covers Metro connectivity, XCFramework signing, Maven resolution, and module-name mismatches. - Use Case: An iOS team using Tuist wants to embed a React Native onboarding flow without installing Node; the skill guides building an XCFramework and calling ReactNativeHostManager.shared.initialize() in the AppDelegate. ## Quick Start Ask the assistant to help you add React Native to your existing native app and decide between the isolated and integrated brownfield approaches.

Frequently Asked Questions about expo-brownfield

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add React Native to an existing native iOS or Android app?

Use Expo's brownfield support with one of two approaches: build React Native as a prebuilt AAR/XCFramework consumed as a library (isolated), or add React Native and Expo directly to your Gradle and CocoaPods builds (integrated). Both require Expo SDK 55 or later.

What is the difference between the isolated and integrated brownfield approaches?

The isolated approach ships React Native as a prebuilt AAR or XCFramework so the native team needs no Node or RN tooling. The integrated approach embeds React Native sources into the existing Gradle/CocoaPods build, giving one unified pipeline with hot reload but requiring RN tooling.

Which Expo SDK version is required for brownfield integration?

Expo SDK 55 is the minimum supported version for brownfield integration. Earlier SDKs lack the expo-brownfield package and the required ExpoReactHostFactory and ExpoReactNativeFactory entry points.

Can the native team consume React Native without installing Node.js?

Yes, with the isolated approach. The React Native side is built into an AAR or XCFramework by the RN team, and the native app consumes it as a regular Maven dependency or embedded framework with no Node, Yarn, or CocoaPods changes required.

Why does my iOS brownfield app crash with 'Library not loaded'?

This happens when not every produced XCFramework is set to Embed & Sign in the app target. On SDK 56+ there are five frameworks including hermesvm.xcframework; using the Swift Package output from build:ios --package links them all automatically.

Why does Gradle say it cannot find my brownfield AAR in mavenLocal?

The mavenLocal() repository must be declared under dependencyResolutionManagement in settings.gradle.kts, not the deprecated allprojects block. Also verify the artifact exists in ~/.m2 and that the group and libraryName match the plugin configuration.