Expo Go

一、Expo Go 是什么？

在 React Native 开发中，我们常常面临一个痛点：每次修改原生代码后，都需要重新编译整个项目才能看到效果。对于纯 JavaScript/TypeScript 层面的开发，这个过程显得非常低效。Expo Go 就是为了解决这个问题而生的。

Expo Go 是 Expo 官方提供的一个预编译客户端应用，可以直接安装在 iOS 或 Android 设备（包括模拟器和真机）上。它内置了一整套 Expo SDK 的原生模块，让你无需本地编译原生代码，只需启动一个开发服务器，就能在手机上实时预览和调试你的 React Native 应用。

简单来说，Expo Go 的核心价值是：

• 跳过原生编译：不需要 Xcode 或 Android Studio 来构建原生包
• 即开即用：从应用商店下载 Expo Go，扫码即可运行你的项目
• 快速迭代：代码改动后，通过 Fast Refresh 几乎实时看到效果

你可以把它理解成一个「React Native 沙盒播放器」：它替你完成了原生编译这一步，让你专注写 JS/TS 代码、看效果。官方对它的定位很明确 —— 面向学生和学习者的快速上手工具

二、Expo Go 的安装和使用

2.1 在手机上安装 Expo Go

Expo Go 是一个普通的手机 App，直接从应用商店下载即可：

• iOS：在 App Store 搜索 “Expo Go” 下载，或扫描 官方文档 中的二维码。
• Android：在 Google Play Store 搜索 “Expo Go”，或访问 Play Store 页面 下载。

装好后打开它，你会看到一个可以扫码的启动界面。先放着，后面要用。

iOS 模拟器 / Android 模拟器：如果你没有真机，也可以用模拟器。npx expo start 启动后按 i 打开 iOS 模拟器，按 a 打开 Android 模拟器。不过官方推荐用真机开发，因为你能看到用户真正会看到的效果 citation。

2.2 创建一个 Expo 项目

确保你电脑上装了 Node.js（LTS 版本即可）。然后在终端里运行：

npx create-expo-app@latest expo-go-app
cd expo-go-app

这条命令会用 create-expo-app 脚手架创建一个默认项目，自带示例代码和文件路由结构。

关于 SDK 版本：目前正处于 SDK 57 过渡期。直接运行 create-expo-app @latest（不带 --template）会创建一个 SDK 54 项目，这个版本兼容 Expo Go 真机运行。如果你想用 SDK 57，需要加 --template default @sdk-57，但 SDK 57 目前不支持在物理设备上用 Expo Go 运行。初学者建议先用默认的 SDK 54 项目。 参考文档

项目创建好后，你会看到这样的目录结构：

my-app/
├── app.json          # 应用配置（名称、图标等）
├── package.json
├── src/
│   └── app/
│       └── index.tsx  # 默认首页
└── ...

2.3 启动开发服务器

在项目目录下运行：

npx expo start

终端会弹出一个二维码和一排快捷键菜单，类似这样：

> expo-go-app@1.0.0 start
> expo start

Starting project at /Users/botao/Demos/botao-20260707-GEEn/expo-go-app
React Compiler enabled
Starting Metro Bundler
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
█ ▄▄▄▄▄ █ ██▀▀█▀▄▀█ ▄▄▄▄▄ █
█ █   █ █  ▀█ ▀█▀██ █   █ █
█ █▄▄▄█ █▀  █▄▀▀▄▀█ █▄▄▄█ █
█▄▄▄▄▄▄▄█▄█ ▀▄█▄▀ █▄▄▄▄▄▄▄█
█▄▄▀█▄ ▄▀▀█▄█▄▀▄▀▄▀█ ▀▄▄ ▄█
█▄█▄▀▄█▄▀█ ▄█▀██▄▄ ▀▀   ▀██
█  ▄█  ▄ ▀█▀▄▀█▄ █▀▄ ▀▄ ▀██
███▀  █▄▀ ▄█ ▄██ ▀████ ▀███
█▄▄▄▄█▄▄█ ▄██▄▀▄▀ ▄▄▄ ▀ ▄▄█
█ ▄▄▄▄▄ █▀▀██▀█▀▀ █▄█ ▀▀▀▀█
█ █   █ █▄▄ ▄▀▄ ▀▄▄ ▄▄▀   █
█ █▄▄▄█ █▀ █ ▄ ▄█▄▄ ▀█▀▀ ██
█▄▄▄▄▄▄▄█▄█▄█▄▄█████▄▄▄▄▄▄█

› Metro waiting on exp://10.25.51.17:8081
› Scan the QR code above with Expo Go (Android) or the Camera app (iOS)

› Web is waiting on http://localhost:8081

› Using Expo Go
› Press s │ switch to development build

› Press a │ open Android
› Press i │ open iOS simulator
› Press w │ open web

› Press j │ open debugger
› Press r │ reload app
› Press m │ toggle menu
› shift+m │ more tools
› Press o │ open project code in your editor

› Press ? │ show all commands

Logs for your project will appear below. Press Ctrl+C to exit.
iOS Bundled 6604ms node_modules/expo-router/entry.js (1436 modules)

2.4 在手机上打开项目

iOS：打开系统自带的“相机”App，对准终端里的二维码，顶部会弹出“在 Expo Go 中打开”的提示，点击即可。

Android：直接在 Expo Go App 里点“Scan QR code”扫码。

如果一切顺利，你会看到默认项目的欢迎页面出现在手机上。到这一步，你已经完成了“代码 → 真机运行”的闭环。

连不上的常见情况

如果扫码后一直加载或报错，最常见的原因是手机和电脑不在同一个局域网，或者公司/校园网络限制了局域网通信。解决办法是在启动时加 --tunnel 参数：

npx expo start --tunnel

Tunnel 模式会通过公网中转流量，不依赖局域网。首次使用可能需要安装 @expo/ngrok，按提示确认即可。然后重新扫码 参考文档。

2.5 在模拟器中打开项目

你可以直接通过如下指令启动 Expo Go 模拟器（以 iOS 为例）

# 启动 iOS 模拟器
npm run ios

如果你已经安装了 iOS Simulator 或 Android Emulator，启动开发服务器后：

• 按 i 键：自动在 iOS Simulator 中安装并打开 Expo Go
• 按 a 键：自动在 Android Emulator 中安装并打开 Expo Go

首次运行时，Expo CLI 会自动下载对应版本的 Expo Go 并安装到模拟器中，无需手动操作。

2.6 使用 Fast Refresh 快速迭代

打开 src/app/index.tsx，找到首页中写着 Welcome! 的标题文字——它在默认模板的 ThemedText 组件里。把这行文字改成 Hello World!，保存文件。

手机上的画面会自动刷新——这就是 Expo Go 默认开启的 Fast Refresh（快速刷新）。它会在你保存文件时自动重新加载修改的组件，同时保留组件的 state，不会把整个 app 重置回初始状态。

如果发现没有自动刷新，可以手动摇一摇手机（iOS）或从顶部下拉（Android）打开开发者菜单，确认 “Fast Refresh” 是开启的，或者按 r 强制重新加载。

2.7 调用设备能力

Expo Go 自带了 Expo SDK 中的一批原生模块，你可以直接在代码里调用相机、通知、图片等设备能力，不需要额外配置原生代码。

比如，用 expo-camera 调用相机。先安装模块：

npx expo install expo-camera

然后在代码中调用：

import { CameraView, useCameraPermissions } from 'expo-camera';
import { useState } from 'react';
import { Button, StyleSheet, Text, View } from 'react-native';

export default function HomeScreen() {
  const [permission, requestPermission] = useCameraPermissions();
  const [facing, setFacing] = useState<'front' | 'back'>('back');

  const toggleCameraFacing = () => {
    setFacing((current) => (current === 'back' ? 'front' : 'back'));
  };

  // 权限未授予（含初始 null 加载态）：提示并请求权限
  if (!permission?.granted) {
    return (
      <View style={styles.container}>
        <Text style={styles.message}>We need your permission to show the camera</Text>
        <Button title="Grant Permission" onPress={requestPermission} />
      </View>
    );
  }

  // 权限已授予：渲染相机预览 + 切换前后摄像头按钮
  return (
    <View style={styles.container}>
      <CameraView style={styles.camera} facing={facing} />
      <View style={styles.controls}>
        <Button title="Flip Camera" onPress={toggleCameraFacing} />
      </View>
    </View>
  );
}

保存后，手机上的 Expo Go 会自动加载新代码，你就能看到相机画面了。完整的组件写法可以参考 Expo Camera 官方文档。Expo SDK 还提供了大量类似模块——Image、Notifications、Location、SecureStore 等等，可以在 SDK API 索引 中查看完整列表。

三、使用场景

Expo Go 并不是所有场景下的最优解，它有明确的适用边界。理解这些边界能帮助你做出正确的技术选型。

3.1 适合使用 Expo Go 的场景

3.2 不适合使用 Expo Go 的场景

Tips：当你的项目超出 Expo Go 的能力范围时，应使用 Development Build（自定义开发客户端）来替代 Expo Go；其构建过程会通过 npx expo prebuild 生成原生工程（ios/、android/）。

四、Expo Go 的能力边界

Expo Go 内置了 Expo SDK 中的大量模块，覆盖了移动开发的常见需求。下面列出主要的能力分类：

设备能力

• 相机（expo-camera）、图片选择（expo-image-picker）
• 定位（expo-location）、传感器（加速度计、陀螺仪等）
• 文件系统（expo-file-system）、安全存储（expo-secure-store）
• 音视频播放（expo-av）、haptics 触觉反馈

UI 与交互

• 字体加载（expo-font）、线性渐变（expo-linear-gradient）
• 模糊效果（expo-blur）、WebView、SVG
• 动画库 react-native-reanimated、手势库 react-native-gesture-handler
• 导航 react-navigation 全套支持

网络与数据

• HTTP 请求（fetch / axios 均可正常使用）
• AsyncStorage、SQLite
• WebSocket

系统集成

• 通知（本地通知）、深度链接
• 应用内浏览器（expo-web-browser）
• 剪贴板、分享

不包含的能力（需要 Development Build）

• 自定义原生模块（Swift/Kotlin 代码）
• 部分需要自定义配置的推送通知方案
• 蓝牙、NFC 等特定硬件接口
• 任何不在 Expo SDK 中的第三方原生库
• App Links / Universal Links——需要原生配置，Expo Go 不支持
• 修改 App 图标、名称、启动画面

你可以在 Expo SDK 文档 中查看完整的模块列表和版本兼容性。

五、Expo Go 与 Development Build 的区别

当你深入使用 Expo 后，会接触到 Development Build 这个概念。它和 Expo Go 的定位不同：

选择建议：

• 刚开始学习 React Native → 用 Expo Go，最小化环境配置
• 项目进入正式开发阶段 → 尽早切换到 Development Build
• 需要第三方原生库 → 必须使用 Development Build

六、总结

Expo Go 是 React Native 生态中一个极其实用的开发工具，它的核心价值在于降低开发门槛和加速迭代效率。

核心要点：

• Expo Go 是预编译的客户端容器，内置了 Expo SDK 的全部原生模块，让你跳过原生编译直接运行项目
• 它适合学习、原型验证和纯 JS/TS 开发阶段，但不适合需要自定义原生代码的场景
• 安装方式简单：手机从应用商店下载，模拟器通过 Expo CLI 自动安装
• 当项目需求超出 Expo Go 的能力范围时，应切换到 Development Build