M3E Canvas 四语言 i18n 工程Parity 测试如何保证日中英韩文案永不脱节【免费下载链接】m3e-canvasSketch Material 3 Expressive screens in the browser and turn them into vibe-coding prompts.项目地址: https://gitcode.com/gh_mirrors/m3/m3e-canvasM3E Canvas 是一款浏览器里的 Material 3 Expressive 界面草图工具支持日文、英文、中文、韩文四种语言界面与提示词随语言即时切换。它的国际化i18n没有复杂框架而是由 lib/i18n.ts 集中存放四语文案再用 lib/i18n.parity.test.ts 这组 Parity对齐测试在每次提交时保证四种语言永远不缺 key、不为空、占位符一致。四语言文案字典都放在哪i18n.ts 集中式资源库文案不按语言拆文件而是集中在一个文件里按表组织字典内容UIKO界面主字典面板、工具栏、检视器、主题等约 300 个 keyKIND_TEXT30 余种组件的默认名词与示例文案按钮、卡片、对话框……TRANSITION_TEXT/SWIPE_TEXT转场与滑动手势描述TAB_LABELS/NAV_TABS/FAB_MENU_TABS/SELECT_OPTIONS导航、标签、菜单的默认条目SEED_TEXT/COLOR_TOKEN_TEXT/TEXT_TOKEN_TEXT示例文本与颜色 token 名称韩文为什么单独一张表主字典UI里每个 key 只内联ja/en/zh三个字段韩文集中放在KO。读取入口 t() 只做一件事t(key, lang) lang ko ? KO[key] : UI[key][lang]这样主字典少一列而KO是否和主字典一样全完全交给 Parity 测试判定从结构上杜绝了韩文版本悄悄漂移。Parity 测试如何做到四语永不脱节CONTRIBUTING.md 定下硬约定任何新增字符串必须同时补齐四语。Parity 测试就是这条约定的自动执法者核心用例语言集合恰好是 en / ja / ko / zh—— 多一个少一个都失败且每个语言的显示名非空韩文 key 集合与主字典完全一致—— 多 key、漏 key 都会被toEqual抓住非空检查会递归到叶子节点—— 嵌套对象如clearAllBody也不能是空白字符串模板占位符与英文对齐—— 用正则提取{url}、{idea}之类的占位符排序后比较任何语言改了占位符名都会立刻报错七张子字典循环校验—— 每张表恰好含四种语言且各语言嵌套 key 结构leafPaths与英文一致。字典与编辑器 token 的双向对齐lib/i18n.parity.test.ts 还会对照 lib/tokens.ts 做覆盖检查每种语言都必须覆盖全部KIND_ORDER组件种类、TRANSITIONS转场、SWIPE_DIRS滑向颜色 token 字典只含 ja / zh / ko英文直接用 token 原名且三者 key 集合两两一致NAV_TABS与FAB_MENU_TABS的图标按索引对齐防止译文顺序错位。字体覆盖同样有测试LANG_FONT必须恰好四语言ja / zh / ko 分别对应Noto Sans JP / SC / KR及完整下载参数而en断言为null英文不需要附加字体。开发者流程一条 npm test 守住四语本地开发与 CI 一样简单npm install npm test新增组件或界面文案时只需记住在 lib/i18n.ts 同时写好 ja、en、zh、ko 四份npm test全绿即可提交。对新手来说Parity 测试最大的价值在于——你不需要记住还有三种语言没写测试会替你记着。更多约定可参考官方文档CONTRIBUTING.md提示词的四语实现见 lib/prompt.ts。【免费下载链接】m3e-canvasSketch Material 3 Expressive screens in the browser and turn them into vibe-coding prompts.项目地址: https://gitcode.com/gh_mirrors/m3/m3e-canvas创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考