Agent Skills › lobehub/lobehub › i18n

i18n

GitHub

LobeHub i18n 开发指南，基于 react-i18next。规范了键名命名、参数插值及文件编辑路径，定义了从添加键到自动翻译的工作流，并提供常用命名空间列表，确保多语言功能正确集成。

.agents/skills/i18n/SKILL.md lobehub/lobehub

Trigger Scenarios

需要添加新的用户界面翻译字符串配置或修复多语言支持问题使用 t() 函数进行国际化调用手动触发本地预览翻译

Install

npx skills add lobehub/lobehub --skill i18n -g -y

More Options

Non-standard path

npx skills add https://github.com/lobehub/lobehub/tree/canary/.agents/skills/i18n -g -y

Use without installing

npx skills use lobehub/lobehub@i18n

指定 Agent (Claude Code)

npx skills add lobehub/lobehub --skill i18n -a claude-code -g -y

安装 repo 全部 skill

npx skills add lobehub/lobehub --all -g -y

预览 repo 内 skill

npx skills add lobehub/lobehub --list

SKILL.md

Frontmatter

{
    "name": "i18n",
    "description": "LobeHub i18n with react-i18next. Use for user-facing strings, locale keys, namespaces, useTranslation, t(), interpolation, zh-CN\/en-US previews, hardcoded UI copy, or bun run i18n.",
    "user-invocable": false
}

LobeHub Internationalization Guide

Default language: English (en-US)
Framework: react-i18next
Only edit files in packages/locales/src/default/ - Never edit JSON files in locales/ (except hand-written en-US/zh-CN previews)
Leave generated locales to the daily auto-i18n.yml workflow by default; run bun run i18n manually only when they are needed immediately

Key Naming Convention

Flat keys with dot notation (not nested objects):

// ✅ Correct
export default {
  'alert.cloud.action': '立即体验',
  'sync.actions.sync': '立即同步',
  'sync.status.ready': '已连接',
};

// ❌ Avoid nested objects
export default {
  alert: { cloud: { action: '...' } },
};

Patterns: {feature}.{context}.{action|status}

Parameters: Use {{variableName}} syntax

'alert.cloud.desc': '我们提供 {{credit}} 额度积分',

Avoid key conflicts:

// ❌ Conflict
'clientDB.solve': '自助解决',
'clientDB.solve.backup.title': '数据备份',

// ✅ Solution
'clientDB.solve.action': '自助解决',
'clientDB.solve.backup.title': '数据备份',

Workflow

Add keys to packages/locales/src/default/{namespace}.ts
Export new namespace in packages/locales/src/default/index.ts
For dev preview: manually translate locales/zh-CN/{namespace}.json and locales/en-US/{namespace}.json
Leave all other locales to .github/workflows/auto-i18n.yml, which runs daily and opens an automated translation PR
Run bun run i18n manually only when the branch needs those translations immediately; it is slow and requires OPENAI_API_KEY

Usage

import { useTranslation } from 'react-i18next';

const { t } = useTranslation('common');

t('newFeature.title');
t('alert.cloud.desc', { credit: '1000' });

// Multiple namespaces
const { t } = useTranslation(['common', 'chat']);
t('common:save');

Common Namespaces

Most used: common (shared UI), chat (chat features), setting (settings)

Others: auth, changelog, components, discover, editor, electron, error, file, hotkey, knowledgeBase, memory, models, plugin, portal, providers, tool, topic