人人都会AI编程

Expo 开发体系、与 Web 端差异

更新时间:2026-07-10

Expo 是一套围绕 React Native 构建的开发工具和服务平台,旨在降低 React Native 开发的门槛,提供一致的开发体验。你可以把它理解为 React Native 的“开箱即用”套件,它隐藏了大量原生配置的复杂性,让开发者能更快地进入业务开发。

Expo 的核心组成部分

  • Expo SDK:一组经过测试的、跨平台的 Native API 集合(相机、定位、推送、传感器等),无需额外配置即可直接调用。每个版本的 Expo SDK 都与特定版本的 React Native 绑定,确保兼容性。
  • Expo Go:一个移动端 App,用于在真机上快速预览 React Native 项目。开发者只需扫描二维码,无需编译原生代码即可运行应用,极大缩短反馈循环。
  • Expo CLI(已合并到 npx expo):本地开发命令行工具,封装了 Metro 打包、构建、模拟器启动、EAS 构建等能力。
  • EAS(Expo Application Services):云服务,提供构建(EAS Build)、提交商店(EAS Submit)、更新(EAS Update,热更新)等功能,替代了旧版的 expo build 流程。

这些组件共同将 React Native 项目从本地开发到分发上线的整个流程标准化,使团队能专注于产品逻辑而非环境维护。

Expo 的两种开发模式

Managed Workflow(托管工作流)

开发者完全在 Expo 的抽象层上工作,不接触原生代码(Android/iOS 目录不可见)。适合绝大多数业务应用,尤其是无需自定义原生模块的项目。优点是无配置、快速启动、OTA 更新方便;缺点是第三方原生模块必须 Expo 支持,否则无法使用。

Bare Workflow(裸工作流)

暴露完整的原生项目目录,开发者可以自由添加任意原生模块、修改原生工程配置。Expo 依旧是核心依赖,但可以根据需要“弹出”到裸工作流,之后仍可利用 Expo 的 API 和 EAS 服务。它适合需要深度定制原生能力的项目,同时也保留了部分 Expo 生态的便利。

与 Web 端开发的差异

React Native + Expo 虽然继承了 React 的声明式组件思想和部分核心 API,但它并非“把 Web 直接搬到手机上”,两者在开发心智模型、组件体系、调试工具、部署流程上存在本质差异。

1. 没有 HTML,只有原生组件

Web 使用 <div><span><input> 等 HTML 元素,而 React Native 提供的是对应原生平台的组件:<View><Text><TextInput> 等。这些组件最终渲染为 Android/iOS 的原生控件(不是 DOM 节点),因此 CSS 样式子集有效(Flexbox 为主,无 Grid,无动画属性全部支持),盒模型和定位规则也存在差异(默认 Flex 方向是 column)。

2. 样式系统是 JS 层面的抽象

样式通过 JavaScript 对象传递,通常使用 StyleSheet.create() 定义,不支持 CSS 文件、className、级联和继承。响应式布局依赖 Dimensions API 或 useWindowDimensions,而非媒体查询。

3. 导航系统完全不同

Web 依赖 URL 路径和 History API,React Native 的导航则是基于原生堆栈/标签页的库,最主流的是 expo-router(基于文件系统的路由,类似 Next.js 的 App Router)或 @react-navigation。页面跳转不涉及 URL,无法通过浏览器向后/前进键自然控制(需手动处理)。

4. 调试和错误提示差异

Web 的 DevTools 可以直接查看 DOM、控制台、网络请求。React Native 使用 Flipper(或 React Native Debugger)进行调试,React Developer Tools 仍然可用,但布局调试不如浏览器直观。Expo Go 的热重载很快,但原生层的崩溃通常需要从设备日志中分析。

5. 平台特有的 API 与权限

Web 无法直接访问相机、传感器、推送通知等设备功能,或能力受限。Expo SDK 提供了一套统一的跨平台 API(如 expo-cameraexpo-location),但在各平台上的行为仍有细微差异,需要读取文档确认。权限模型的声明和请求也完全不同(Android 的 app.json 配置、iOS 的 Info.plist 描述等)。

6. 更新与发布有本质区别

Web 应用部署后,用户刷新即获得最新版本。React Native 的应用包需要走应用商店审核,更新周期长。Expo 的 EAS Update 提供类似“热更新”的能力,允许在应用商店审核之外推送 JavaScript 层修改,但原生代码变更仍需要重新构建并发布商店版本。

7. 开发体验的一致性

Expo 提供了统一的本地开发服务器,无论是 iOS/Android 模拟器还是 Expo Go 实机扫码,都可以快速预览。Web 基于浏览器,无需额外工具,Expo for Web 也能将同一套代码编译为 Web 应用,但适用场景有限,不建议用于复杂的 SEO 或深层 Web 交互。

何时使用 Expo(Managed)

  • 创业团队、独立开发者希望快速验证想法
  • 内容类、工具类应用,无需自定义原生模块
  • 注重开发效率和快速迭代

何时选择 Bare Workflow 或纯 RN CLI

  • 需要集成特定原生 SDK(如支付、地图、蓝牙等未在 Expo SDK 中覆盖的模块)
  • 对原生性能有极高要求,需要手写 Objective-C/Java/Kotlin 代码
  • 接手需要逐步迁移的老项目

总结

Expo 将 React Native 开发从繁琐的原生配置中解放出来,使移动端开发体验更加接近 Web 的“即时反馈”特性。但开发者必须认识到 Web 和 Native 之间的本质鸿沟:组件、样式、导航、API、调试、发布的每个环节都需要重新适应。好在 React 的核心思想——组件化、单向数据流——在两端完全一致,这种思维上的延续能让 Web 开发者快速上手移动端,这也是 React 技术栈“Learn Once, Write Anywhere”最有力的体现。