Loading...
Loading...
Internationalization guide using react-i18next. Use when adding translations, creating i18n keys, or working with localized text in React components (.tsx files). Triggers on translation tasks, locale management, or i18n implementation.
npx skill4agent add lobehub/lobehub i18nsrc/locales/default/locales/pnpm i18n// ✅ Correct
export default {
'alert.cloud.action': '立即体验',
'sync.actions.sync': '立即同步',
'sync.status.ready': '已连接',
};
// ❌ Avoid nested objects
export default {
alert: { cloud: { action: '...' } },
};{feature}.{context}.{action|status}{{variableName}}'alert.cloud.desc': '我们提供 {{credit}} 额度积分',// ❌ Conflict
'clientDB.solve': '自助解决',
'clientDB.solve.backup.title': '数据备份',
// ✅ Solution
'clientDB.solve.action': '自助解决',
'clientDB.solve.backup.title': '数据备份',src/locales/default/{namespace}.tssrc/locales/default/index.tslocales/zh-CN/{namespace}.jsonlocales/en-US/{namespace}.jsonpnpm i18nimport { 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');commonchatsetting