跳轉到內容
supastack
瀏覽檔案
WebTanStack Start

For AI agents: fetch the complete documentation index at /llms.txt, the full documentation corpus at /llms-full.txt, the agent skill at /skill.md, or this page as Markdown at /zh-tw/docs/modules/i18n.md (or send Accept: text/markdown).

i18n 模組

每個介面共享的語言契約。

詢問本指南
開啟方式

開始之前

使用“檔案”→“開啟資料夾”在 Visual Studio Code 中開啟下載的 supastack 專案,然後選擇“終端”→“新建終端”。儲存庫根目錄是包含 package.json、apps 和 packages 的資料夾。執行下面的命令並保持終端開啟。如果無法識別命令,請先完成工具安裝指南,然後再繼續。

首先閱讀平臺教程。伺服器是響應瀏覽器或電話請求的應用程式程式。 Web 讀取 apps/web/.env.local,Expo 讀取 apps/mobile/.env.local,資料庫遷移命令讀取 root .env。無資料庫/儀錶板演示與真實/身份驗證帳戶分開,需要遷移Postgres。僅電話或桌面結帳需要單獨執行的 Web 後端。

corepack pnpm --filter @supastack/web dev

安裝與配置

packages/i18n 擁有語言集合與解析契約:SUPPORTED_LOCALES、DEFAULT_LOCALE、LOCALE_COOKIE、isAppLocale、resolveLocale、localePath 與 getDictionary。Web 路由、移動端文案與事務郵件都讀同一個包。

解析順序是路徑字首 → cookie → Accept-Language → 預設值。localePath(locale, path) 產出規範連結 —— 預設語言無字首,其餘為 /{locale}/… —— 代理由此執行。

import { getDictionary, localePath, resolveLocale } from "@supastack/i18n";

const locale = resolveLocale([pathLocale, cookie, acceptLanguage]);
const copy = getDictionary(locale).marketing;

實現流程

新增面向使用者的字串時先加進詞典型別,再補全每種語言 —— 翻譯完整性套件會對缺失鍵與未翻譯的英文文本報錯。

永遠不要讓產品邏輯按語言分支;詞典是表現層。日期、數字與複數用帶解析語言的 Intl API 格式化,而不是字串模板。

驗證與排障

改動鍵之後執行 i18n 包測試與 site-content 完整性套件。抽查語言字首路由、語言切換器,以及清掉 cookie 後的 Accept-Language 檢測。