react-admin 是做什么的？
为 react-admin 或 shadcn 管理后台应用提供国际化指南。适用于添加 i18n 支持、创建翻译文件、翻译 JSX 中的硬编码英文字符串，或审查 react-admin 项目中与国际化相关的拉取请求。涵盖命名空间约定、插值、复数形式、本地化格式，以及将仅英文应用转换为多语言应用的完整工作流程。当用户提及 i18n、国际化、翻译、本地化等关键词时触发此技能。
命名空间约定
- 使用命名空间按功能模块组织翻译键，例如：
resources.users.fields.name或common.save。 - 避免扁平化结构，优先使用嵌套对象以增强可读性。
- 遵循 react-admin 的默认命名空间（如
resources、ra、common）。
插值与参数
- 在翻译字符串中使用
{{param}}语法进行插值。 - 始终为插值参数提供默认值或回退值，以避免缺失键时的渲染错误。
- 示例：
"Hello, {{name}}!"对应{ name: 'John' }。
复数形式
- 使用
_plural后缀或one/other键处理复数。 - 示例：
"item"："1 item""item_plural"："{{count}} items"
- 对于复杂语言规则，使用带
count参数的嵌套对象。
本地化格式
- 使用
Intl.DateTimeFormat、Intl.NumberFormat等浏览器 API 进行本地化格式化。 - 确保日期、时间和货币格式与当前语言环境保持一致。
- 在翻译文件中避免硬编码格式；使用 react-admin 的
useLocale钩子获取当前区域设置。
工作流程：从仅英文到多语言
- 审计硬编码字符串：扫描所有 JSX 文件，查找未包裹在
translate()或useTranslate中的英文字符串。 - 创建翻译文件：为每种目标语言创建 JSON 文件，遵循命名空间结构。
- 迁移字符串：将字符串移至翻译文件，并在 JSX 中使用对应的键。
- 处理插值和复数：确保所有参数化字符串正确使用插值和复数语法。
- 测试：切换语言环境，验证所有字符串正确翻译，且无缺失键。
- 优化：使用 lint 工具检查未使用的翻译键，并清理冗余条目。
代码示例
import { useTranslate } from 'react-admin';
const MyComponent = () => {
const translate = useTranslate();
return <span>{translate('common.welcome', { name: 'Admin' })}</span>;
};