> ## Documentation Index
> Fetch the complete documentation index at: https://supastack.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For the full documentation corpus in one file, fetch: https://supastack.dev/llms-full.txt

# 專案結構

找到路由、功能模組以及與後端的邊界。

## 安裝與配置

開始任何步驟前，請閱讀[開始之前](https://supastack.dev/zh-tw/docs/mobile/before-you-start.md)和[終端基礎](https://supastack.dev/zh-tw/docs/mobile/terminal-basics.md)。在根目錄開啟 supastack 資料夾——即包含 package.json 的資料夾。Mobile checkout 包含 apps/mobile 和下述共享包；All Platforms monorepo 還附帶 Web 後端和 Desktop 外殼。環境變數是儲存在本地 .env 檔案或託管平臺控制台中的命名設定；修改後要重啟應用，且伺服器金鑰絕不能出現在 EXPO_PUBLIC_ 值中。

1. 在編輯器中開啟 `apps/mobile/app/_layout.tsx`——每個介面共享的根佈局。

2. 瀏覽 `apps/mobile/src/`——每個功能領域一個資料夾，各自存放其邏輯與測試。

3. 在儲存庫根目錄執行 `corepack pnpm --filter @supastack/mobile start`，然後在您的裝置上開啟預覽。

Expo 應用按“路由呼叫功能模組”的方式組織。路由保持精簡——它們只渲染介面；它們呼叫的邏輯連同測試一起放在 `src/` 下。修改行為前先閱讀 AGENTS.md 和 .ai/PROJECT_CONTEXT.md；`.ai/` 映象檔案記錄了單從檔案看不出的決策。

```
apps/mobile/app/          Expo Router routes — sign-in, onboarding, invite, paywall
apps/mobile/app/(app)/    Signed-in screens — home, chat, notifications, settings, content, commerce, assistant
apps/mobile/src/          Feature modules — auth, api, purchases, offline, push, ui, theme, i18n
packages/ui-native/       Shared native view-models
packages/design-tokens/   Shared theme tokens
apps/mobile/app.config.ts Scheme and allowed-origin derivation
apps/mobile/eas.json      EAS build and submit profiles
docs/                     Runbooks incl. store submission
.agents/skills/           Task guides for coding agents
```


## 改動應該放在哪

編輯前先確定改動屬於哪個資料夾。經驗法則：路由檔案只負責渲染；可複用邏輯放在 `src/` 模組中；任何必須由伺服器決定的事情絕不進入應用。

[構建您的第一個移動端功能](https://supastack.dev/zh-tw/docs/mobile/first-feature.md)

- 新的已登入介面 → `apps/mobile/app/(app)/` 放路由，`apps/mobile/src/<feature>/` 放其邏輯。
- 新的未登入或獨立介面 → `apps/mobile/app/` 中 `(app)` 組之外的位置。
- 呼叫後端 → `apps/mobile/src/api/client.ts`——擴充套件型別化客戶端，而不是臨時發起 fetch。
- 多個介面共用的視覺元素 → `apps/mobile/src/ui/` 原語；跨平臺檢視模型 → `packages/ui-native/`。
- 顏色、間距和深色/淺色值 → `apps/mobile/src/theme/`，由 `packages/design-tokens/` 提供支援。
- 新的翻譯鍵 → `apps/mobile/src/i18n/` 下全部四個目錄。
- 任何伺服器端的內容——資料、許可權、提供商呼叫 → Web 後端儲存庫；對僅購買 Mobile 的使用者來說它是單獨的 checkout。


## 實現流程

從路由檔案開始，跟隨它渲染的功能模組，再到 API 客戶端呼叫——伺服器決定所有權；應用絕不自行推導。`.agents/skills/` 中的 `add-a-mobile-screen` 技能按同樣的順序走一遍。

編輯共享包或 API 客戶端後執行包測試與型別檢查；客戶端必須保持與後端一致的契約。


## 驗證與排障

如果 `expo start` 報告缺少模組，請在儲存庫根目錄執行安裝命令——僅靠應用資料夾無法解析 workspace 包。如果某個介面看起來沒有樣式，請檢查它是否組合了 `src/ui` 原語，而不是使用硬編碼顏色的原始元素。

```
corepack pnpm --filter @supastack/mobile test
corepack pnpm --filter @supastack/mobile typecheck
```


## 下一篇

[構建你的第一個功能](https://supastack.dev/zh-tw/docs/mobile/first-feature.md)