项目结构

Expo Router 默认结构

my-app/
├── src/
│   ├── app/                    # 文件路由页面
│   │   ├── _layout.tsx         # 根布局
│   │   └── index.tsx           # 根路由
│   ├── components/             # 非路由组件
│   ├── constants/              # 常量
│   └── hooks/                  # 自定义 Hook
├── assets/                     # 图片、字体等静态资源
├── app.json                    # Expo 应用配置
├── eas.json                    # EAS Build 配置
├── package.json
└── tsconfig.json

src/app 只放路由页面和布局。普通组件、Hook、服务与工具函数应放在该目录之外，否则 Expo Router 会尝试将文件识别为路由。

应用配置

app.json 或 app.config.ts 描述应用名称、图标、包标识、权限和 Config Plugin。需要读取环境变量或编写条件逻辑时使用动态配置：

import type { ExpoConfig } from 'expo/config'

const config: ExpoConfig = {
  name: 'My App',
  slug: 'my-app',
  scheme: 'myapp',
  ios: {
    bundleIdentifier: 'com.example.myapp',
  },
  android: {
    package: 'com.example.myapp',
  },
}

export default config

ios.bundleIdentifier 与 android.package 是应用商店和系统识别应用的稳定标识，发布后不应随意修改。

平台文件

Metro 支持按平台解析文件：

button.tsx
button.native.tsx
button.android.tsx
button.ios.tsx
button.web.tsx

优先提取共享实现，只在交互或平台 API 确实不同时使用平台文件，避免维护多套重复逻辑。

环境变量

客户端可访问的环境变量必须以 EXPO_PUBLIC_ 开头：

EXPO_PUBLIC_API_URL=https://api.example.com

const apiUrl = process.env.EXPO_PUBLIC_API_URL

客户端变量会进入应用包，不能存放密钥、签名凭证或服务端令牌。敏感信息应保留在服务端或 EAS 的构建环境中。

原生目录

采用 Continuous Native Generation 时，android 和 ios 由应用配置与 Config Plugin 生成，通常不提交到仓库：

npx expo prebuild

直接维护原生工程时，应将其视为源代码提交，并避免使用清理式 Prebuild 覆盖手动修改。

参考资料

• Expo Router 核心约定
• Expo 应用配置
• 环境变量