用途:该技能用于在 Langflow 前端新增、修改或审查用户可见文本,基于 i18next + react-i18next 的国际化体系。
主要能力与基本规则:所有用户可见字符串必须通过 t(...) 获取,不能在 JSX 中硬编码标签、按钮、提示、弹窗、通知、错误、占位符、aria-label 或空状态文本;每个新键必须在同一个 PR 中写入全部语言文件(en.json、de.json、es.json、fr.json、ja.json、pt.json、zh-Hans.json)。由于 fallbackLng 为 "en",缺失的键会静默回退英文而不会报错,因此审查环节尤其重要。
工作方式:配置文件为 src/frontend/src/i18n.ts。en 静态打包,其他语言由 loadLanguage() 通过动态 import 懒加载。语言偏好取自 localStorage.getItem("languagePreference"),并做归一化(如 zh-CN → zh-Hans,未知则用 en)。键为扁平结构,按功能用点号命名空间,如 deleteModal.title、errors.fileTooLarge、crash.restartButton,应沿用所在区域现有命名空间,只有真正新增界面时才新建前缀。插值在字符串中用 {{variable}},调用时传入选项对象。
使用方式(示例): import { useTranslation } from "react-i18next"; const { t } = useTranslation(); {t("deleteModal.title")} 在 locales/en.json 及其他语言文件中添加: "errors.fileTooLarge": "The file size is too large. Please select a file smaller than {{maxSizeMB}}." 非英语语言若确信可给出真实翻译;否则先填入英文值并在 PR 中标注,因为存在但未翻译的键可见可搜索,缺失的键则不可见。
防错规则:不要拼接翻译片段(t("a") + name + t("b")),语言间语序不同,应使用单个键加插值 t("greeting", { name });翻译字符串中不放 JSX/HTML,在 t() 调用外围用 JSX 组合(参见 crash.descriptionBefore / crash.githubIssues / crash.descriptionAfter 围绕链接拆分的方式);复数使用 i18next 的 _one / _other 后缀,而非 count === 1 ? ... : ...;键即代码,重命名或删除键必须同步更新全部七个语言文件;日期、数字、货币用 Intl.* 结合当前语言格式化,不得硬编码格式。
审查清单:JSX 中无硬编码用户可见字符串(含 placeholder、title、aria-label、通知/错误文本);每个新键存在于所有语言文件(可在 src/frontend/src/locales/.json 中 grep 该键);无翻译片段拼接,改用插值;删除或重命名的键在所有语言中清理干净,无孤立键;键遵循该功能区域现有的点号命名空间。快速检查某键在各语言中的缺失情况: for f in src/frontend/src/locales/.json; do grep -L '"my.new.key"' "$f"; done (输出缺失该键的语言文件,正常情况下不应有输出)
适用场景:任何涉及 Langflow 前端界面文本的改动与代码审查。限制:资料未提供除上述语言文件与规则之外的其他平台、收费或效果信息。