
Expo Brownfield 测试应用实战expo-app 如何构建与分发 Android/iOS Brownfield 工件【免费下载链接】expoAn open-source framework for making universal native apps with React. Expo runs on Android, iOS, and the web.项目地址: https://gitcode.com/GitHub_Trending/ex/expo本篇以 Expo 仓库中的 brownfield 测试应用apps/brownfield-tester/expo-app/README.md为主体讲解expo-app的用途、目录角色、运行方式以及如何用expo-brownfield内置 CLI 将应用打包为可复用的 brownfield 工件Android 的 Maven 制品、iOS 的 xcframework。读完后你将掌握 brownfield 模式的完整工作流从 Metro 调试到工件构建、再到原生宿主应用消费工件的两种集成路径并了解 CLI 各参数在源码中的实际定义。brownfield-tester 的定位与目录角色apps/brownfield-tester/expo-app是 Expo 官方的Expo Brownfield Test App其职责有两个见 README用于测试expo-brownfield包本身以及它与expo-router、expo-updates、expo-dev-menu等包的集成作为expo-brownfieldE2E 测试的基础应用base app。结合上层目录的 README 可以看到整个brownfield-tester由三部分构成三者关系是理解本文档的骨架目录角色关键点expo-app/React Native / Expo 应用提供 JavaScript 源码同时是 brownfield 工件的构建源头integrated/原生 Android/iOS 应用通过 Expo autolinking 直接集成 monorepo构建期解析模块isolated/原生 Android/iOS 应用消费预构建的 brownfield 工件Maven / xcframeworks构建期不依赖 monorepo其中isolated/被明确标注为「推荐的分发方式」the recommended distribution approach即把 brownfield 能力以二进制工件形式交付给已有原生应用而integrated/则在其 README 中带有醒目警告它把构建与项目根目录重定向到../expo-app属于「不应复制」的临时性测试配置仅用于 autolinking 场景的验证。expo-app 的依赖与入口结构从 package.json 可以看出该应用的所有 Expo 相关依赖均以workspace:*方式引用 monorepo 内的本地包核心依赖包括expo、expo-brownfieldbrownfield 工具包expo-router路由、expo-dev-menu开发菜单、expo-splash-screen、expo-constants、expo-device、expo-linking、expo-font、expo-image、expo-system-ui、expo-symbols、expo-web-browser、expo-glass-effect原生侧依赖react-native0.87.0、react19.2.3以及react-native-reanimated、react-native-screens、react-native-safe-area-context、react-native-gesture-handler等入口文件 index.js 展示了 brownfield 测试的典型双注册模式import { registerRootComponent } from expo; import { App } from expo-router/build/qualified-entry; import { AppRegistry } from react-native; import { CustomComponent } from ./src/components; // main component from expo-router registerRootComponent(App); // Additional custom component AppRegistry.registerComponent(custom-component, () CustomComponent);这里把expo-router的App注册为主组件同时额外注册了一个custom-component。这一设计对应 E2E 测试中验证「brownfield 宿主能否独立拉起非主入口组件」的场景src/app/下的路由apis/navigation.tsx、apis/communication.tsx、apis/state.tsx、apis/dev-menu.tsx等则分别覆盖导航、原生通信、状态共享、开发菜单等功能面。app.json 中的plugins配置声明了expo-brownfield插件及其关键参数[ expo-brownfield, { ios: { buildReactNativeFromSource: false }, android: { publishing: [ { type: localMaven } ] } } ]ios.buildReactNativeFromSource: falseiOS 构建时不重新编译 React Native 源码android.publishing声明了localMaven发布目标——这正是后文build:android --repo MavenLocal命令能够把工件发布到本地 Maven 仓库的前提。用 Metro 调试AndroidREADME 给出的调试约束是若要在调试模式下通过 Metro Bundler 使用本应用请在应用目录运行yarn start并且使用Debug或All构建类型build type产出的工件——该能力目前仅支持 Android。对应 package.json 中的scripts.startexpo start即可启动 Metro。这条限制说明 brownfield 工件中的Debug构建类型保留了开发服务器连接能力而Release类型面向生产分发Android 侧的 Debug/All 构建类型差异由工件中内嵌的启动逻辑控制expo-brownfield的 Android 插件会向 Gradle 工程注入相关配置见 withProjectBuildGradlePlugin.ts 等插件实现。构建 brownfield 工件CLI 完整命令与参数README 中给出的最简构建命令是# Android npx expo-brownfield build:android --repo MavenLocal --all --verbose # iOS npx expo-brownfield build:ios --release --verbose npx expo-brownfield build:ios --debug --verboseiOS 侧之所以要分两次执行--release与--debug是因为宿主原生应用在 Xcode 中通常按 Debug/Release 两种 configuration 链接 xcframework需要各一份对应构建类型的工件。结合 isolated/README.md 给出的前置步骤完整构建流程应为先 prebuild 生成原生工程再构建发布cd apps/brownfield-tester/expo-app # Android — 构建并发布到 MavenLocal npx expo prebuild --clean -p android npx expo-brownfield build:android --repo MavenLocal --all --verbose # iOS — 构建 xcframeworks npx expo prebuild --clean -p ios npx expo-brownfield build:ios --release --verbose npx expo-brownfield build:ios --debug --verbosenpx expo-brownfield实际执行的是 packages/expo-brownfield 包中的 CLI其 package.json 声明bin: ./bin/cli.js。从 CLI 入口源码 cli/src/index.ts 可以看到各命令的完整参数集build:android构建并发布 Android 工件参数含义-d, --debug构建 debug 变体-r, --release构建 release 变体-a, --all同时构建 debug 和 release 变体--fused通过 AGP Fused Library 以每个变体一个 fat AAR 的形式发布--verbose把 Gradle 全部输出转发到终端-l, --library name指定 brownfield 库名-t, --task task...指定要执行的发布任务可传多个--repo, --repository repo...指定发布目标仓库可传多个如MavenLocal--dry-run仅打印将执行的命令不实际运行build:ios构建 iOS 工件参数含义-d, --debug构建 debug configuration-r, --release构建 release configuration--verbose转发全部 Xcode 构建输出-s, --scheme scheme指定 iOS scheme 名-x, --xcworkspace path指定 Xcode workspace 路径.xcworkspace-a, --artifacts path指定工件输出目录-p, --package [name]将工件打包为 Swift Package可附带包名--host-provided frameworks...宿主 App 已提供的 framework 列表构建时从工件中剥离如SDWebImage,SDWebImageWebPCoder避免符号冲突--dry-run仅打印命令两个命令都支持--dry-run这是排查「CLI 到底会执行什么」时非常实用的手段。此外 CLI 还提供 tasks:android 命令用于列出当前工程可用的发布任务与仓库配合-t/--task与--repo使用。工件如何被消费Android工件发布到 Maven Local 后宿主应用在 Gradle 仓库配置中声明mavenLocal()即可解析见 isolated/README.md打开isolated/android/工程即可正常构建iOS构建出 xcframeworks 后可借助 E2E 脚本 add_xcframeworks.rb 把包含框架的本地 Swift Package 加入 Xcode 工程也可以手动通过 Xcode 的 “Add Package Dependencies” 指向本地包路径。integrated 与 isolated两条验证路径expo-app生成的工件最终要回答一个问题brownfield 能力放进一个独立的原生宿主后是否可用。仓库为此提供了两条验证路径integratedautolinking 路径原生工程把项目根指向../expo-app模块在构建期从 monorepo 的node_modules解析。其 README 记录了初始化细节Android 侧基于 Android Studio 2025.1.3 的 Empty Activity 项目创建并按 Brownfield Integration 指南集成 Expo 模块由于 React Native 面向 Java 17需移除app/build.gradle.kts中默认的compileOptions并移除settings.gradle.kts中dependencyResolutionManagement的repositoriesMode因为react-native插件会自行配置 maven 仓库。iOS 侧基于 Xcode 26 的 SwiftUI 项目创建且因 Swift 6 支持尚不完整需在项目设置中将 “Default Actor isolation” 设为 “nonisolated”。isolated工件路径推荐原生工程完全自包含Android 从mavenLocal()解析 brownfield 库iOS 通过本地 Swift Package 消费 xcframeworks构建期不接触 monorepo。这种「先工件、后消费」的结构也解释了为什么 E2E 测试需要以expo-app为 base appE2E 脚本如 run-e2e-android.sh、run-e2e-ios.sh先构建工件再将其安装到原生宿主应用中执行 Maestro 场景e2e/maestro 下的navigation.yml、state.yml、dev-menu.yml、communication.yml等流程端到端验证 expo-app 中注册的导航、状态、通信与开发菜单功能在 brownfield 环境下的行为。小结apps/brownfield-tester/expo-app是验证expo-brownfield的核心试验场它既是expo-router/expo-updates/expo-dev-menu集成的测试宿主也是 E2E 流水线中工件的构建源头。掌握它的两条主线命令即可复现完整 brownfield 工作流——Android 用npx expo-brownfield build:android --repo MavenLocal --all --verbose发布 Maven 工件iOS 分别用build:ios --release/--debug --verbose产出 xcframeworks调试期则依赖 Metro 与 Android 的 Debug/All 构建类型。所有 CLI 参数均可在 packages/expo-brownfield/cli/src/index.ts 中逐条核对--dry-run与tasks:android是调试构建流程时的可靠帮手。【免费下载链接】expoAn open-source framework for making universal native apps with React. Expo runs on Android, iOS, and the web.项目地址: https://gitcode.com/GitHub_Trending/ex/expo创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考