
关于
国际化和本地化模式。检测硬编码字符串、管理翻译、语言文件、RTL 支持。
name: i18n-localization description: "国际化和本地化模式。检测硬编码字符串、管理翻译、区域设置文件、RTL支持。" risk: safe source: community date_added: "2026-02-27"
国际化与本地化
国际化(i18n)和本地化(L10n)最佳实践。
1. 核心概念
| 术语 | 含义 | |------|---------| | i18n | 国际化 - 使应用可翻译 | | L10n | 本地化 - 实际翻译工作 | | Locale | 语言 + 地区 (en-US, tr-TR) | | RTL | 从右到左的语言(阿拉伯语、希伯来语) |
2. 何时使用 i18n
| 项目类型 | 需要 i18n? | |--------------|--------------| | 公开网站应用 | 是 | | SaaS 产品 | 是 | | 内部工具 | 视情况而定 | | 单一地区应用 | 考虑未来需求 | | 个人项目 | 可选 |
3. 实现模式
React (react-i18next)
import { useTranslation } from 'react-i18next';
function Welcome() {
const { t } = useTranslation();
return <h1>{t('welcome.title')}</h1>;
}
Next.js (next-intl)
import { useTranslations } from 'next-intl';
export default function Page() {
const t = useTranslations('Home');
return <h1>{t('title')}</h1>;
}
Python (gettext)
from gettext import gettext as _
print(_("Welcome to our app"))
4. 文件结构
locales/
├── en/
│ ├── common.json
│ ├── auth.json
│ └── errors.json
├── tr/
│ ├── common.json
│ ├── auth.json
│ └── errors.json
└── ar/ # RTL
└── ...
5. 最佳实践
应该做
- 使用翻译键,而非原始文本
- 按功能模块命名翻译空间
- 支持复数形式
- 按区域设置处理日期/数字格式
- 从一开始就规划RTL支持
- 对复杂字符串使用ICU消息格式
不应该做
- 在组件中硬编码字符串
- 拼接已翻译的字符串
- 假设文本长度(德语比英语长30%)
- 忘记RTL布局
- 在同一文件中混合语言
6. 常见问题
| 问题 | 解决方案 | |-------|----------| | 缺少翻译 | 回退到默认语言 | | 硬编码字符串 | 使用检查器/检查脚本 | | 日期格式 | 使用 Intl.DateTimeFormat | | 数字格式 | 使用 Intl.NumberFormat | | 复数形式 | 使用ICU消息格式 |
7. RTL 支持
/* CSS Logical Properties */
.container {
margin-inline-start: 1rem; /* Not margin-left */
padding-inline-end: 1rem; /* Not padding-right */
}
[dir="rtl"] .icon {
transform: scaleX(-1);
}
8. 检查清单
发布前:
- [ ] 所有面向用户的字符串使用翻译键
- [ ] 所有支持语言的区域设置文件已存在
- [ ] 日期/数字格式使用 Intl API
- [ ] RTL布局已测试(如适用)
- [ ] 已配置回退语言
- [ ] 组件中无硬编码字符串
脚本
| 脚本 | 用途 | 命令 |
|--------|---------|---------|
| scripts/i18n_checker.py | 检测硬编码字符串和缺失翻译 | python scripts/i18n_checker.py <project_path> |
何时使用
此技能适用于执行概述中描述的工作流程或操作。
限制
- 仅在任务明确匹配上述描述范围时使用此技能。
- 不要将输出视为环境特定验证、测试或专家审查的替代品。
- 如果缺少所需输入、权限、安全边界或成功标准,请停下来寻求澄清。
兼容工具
Claude CodeCursor
标签
前端开发