Files

Zikai d9309756c7 fix: 子模块 i18n 桥接 -- 透传 :locale prop，修复嵌入页显示 i18n ID

根因：子项目组件用 useI18n({useScope:'global'}) 注入，嵌入时解析到宿主
mainPage 的 i18n 实例（不含子项目文案）-> 文案回退成 key（显示 ID）。

修复：
- z449 / timeTableFix 组件改用 useLocale composable 直读自身模块级 i18n 实例
- ttf 新增独立 i18n（中英 locale + useLocale），抽取所有硬编码中文
- mainPage 侧 Timetable/MobileGameWrapper 包装器透传 :locale prop
- 两个子模块 gitlink 更新至各自修复 commit

验证：构建后两个子模块 chunk 含真实中文文案，无 useI18n 注入残留

2026-07-24 09:02:38 +00:00

3.5 KiB

Raw Blame History

子项目 z449（git submodule + i18n 桥接）

z449（移动游戏项目展示页）作为 git submodule 被 mainPage 引入，位于 third_party/z449，独立仓库为 https://git.zikai.wang/zikai/z449.git 。

集成方式

mainPage 侧的 src/modules/mobile-game/MobileGameWrapper.vue 包装器 import 子模块的 src/App.vue 作为组件，并持有 KeepAlive 匹配名 defineOptions({ name: 'mobile-game' })。

子模块 App.vue 是便携式组件：嵌入与独立运行两用。它自带独立 vue-i18n 实例与自己的 locale 文案（mobileGame.*），不共享 mainPage 的 messages。
i18n 桥接：mainPage 把当前语言经 :locale prop 透传给子模块的 App.vue；后者 watch 该 prop，同步到自己的 i18n 实例 locale。这样切换语言时，移动游戏页内容跟随父项目响应式切换，文案来自 z449 自有 locale。
子模块独立运行时不接收 prop，默认中文。
构建期集成（非 iframe），共享 mainPage 的构建与 KeepAlive 缓存。
子模块样式已隔离（scoped），全局重置/令牌仅在独立 app 的 main.js 加载，嵌入时不加载，复用宿主 :root 令牌级联。

克隆（含子模块）

git clone --recursive https://git.zikai.wang/zikai/zMainPage.git mainPage

若已 clone 但未带子模块：

cd mainPage
git submodule update --init --recursive

构建前需在子模块目录内 npm install（mainPage 的 Vite 编译子模块 .vue，但子模块依赖如 vue-i18n 须各自安装）：

cd third_party/z449 && npm install

升级子模块到最新版本

cd mainPage
git submodule update --remote third_party/z449       # 拉取最新
cd third_party/z449 && git checkout master            # 固定到目标分支/commit
cd ../..
git add third_party/z449                              # 更新 gitlink 指针
git commit -m "chore: 升级 z449 子模块"
npm run build                                         # 重新构建 mainPage
git push                                              # 推送 mainPage（gitlink）

推送顺序：先确保子模块的 commit 已推到 z449.git，再推 mainPage 的 gitlink，否则别人 clone mainPage 时拉不到子模块对应 commit。

移除子模块集成（仅移除 mainPage 页签，不影响 z449 本身）

cd mainPage
git submodule deinit -f third_party/z449
git rm third_party/z449
git commit -m "chore: 移除 z449 子模块集成"

同时删 src/modules/mobile-game/ 文件夹即移除页签。z449 独立仓库不受影响。

z449 仅作为 submodule 被 mainPage 构建期集成，无独立线上入口。独立开发/测试用其自身的 npm run dev / npm run build。

与 timeTableFix 子模块的差异

维度	早期 timeTableFix	timeTableFix（现已 i18n）	z449
i18n	无（硬编码中文）	自带独立 vue-i18n，中英双语	自带独立 vue-i18n，中英双语
语言同步	无需	经 `:locale` prop 桥接	经 `:locale` prop 桥接
文案来源	组件内硬编码	ttf 自有 locale 文件（单一来源）	z449 自有 locale 文件（单一来源）

两个子项目均采用相同的 i18n 桥接模式：各自维护独立 vue-i18n 实例与 locale 文案，组件内用 useLocale composable 直接读自身实例（而非 useI18n() 注入，否则嵌入时会解析到宿主实例导致文案回退成 key），mainPage 侧包装器经 :locale prop 透传当前语言。

3.5 KiB Raw Blame History Unescape Escape