SuperAPI AI 工具集

localization-engineer

前端与建站

查看项目

更新于 10-15 20:30

技能介绍

用途:帮助构建支持多语言的应用程序,提供国际化(i18n)与本地化(l10n)支持,适用于多语言应用、国际化产品发布、全球 SaaS、多国电商与内容管理系统。

主要能力:多语言文本内容;日期与时间格式化;数字与货币格式化;从右到左(RTL)支持;翻译管理;语言检测;语言切换;区域特定内容;多语言站点 SEO。

使用方式(Next.js,基于 next-intl):先安装依赖,npm install next-intl。在 i18n/request.ts 中通过 getRequestConfig 按 locale 动态导入 messages(如 ../messages/${locale}.json);在 middleware.ts 中用 createMiddleware 配置 locales(示例:['en','es','fr','de','ja'])与 defaultLocale,并设置 matcher 排除 api、_next 等路径。翻译文件按命名空间组织,如 common、navigation、auth。客户端组件用 useTranslations('auth') 取词;服务端组件同样使用 useTranslations。语言切换通过 useLocale、useRouter、usePathname 组合,替换路径中的 locale 后跳转。格式化使用 useFormatter,支持 format.dateTime(完整/短/自定义样式、relativeTime)、format.number(数字、货币、百分比、紧凑记法)。复数通过 ICU 语法在消息中定义,如 {count, plural, =0 {No items} one {# item} other {# items}}。RTL 在布局中根据语言列表(ar、he、fa)设置 dir,CSS 建议使用逻辑属性如 margin-inline-start,必要时用 [dir='rtl'] 单独覆盖。语言检测依次检查 URL 参数、localStorage、浏览器语言,最后回退默认值。变量插值支持 {name}、{count} 以及 {price, number, ::currency/USD} 等。翻译同步可通过 Lokalise 等服务的 API 拉取并写入 messages 目录。缺失翻译可通过 getMessageFallback 返回命名空间与键名便于排查;多语言 SEO 在 generateMetadata 中设置 title、description、canonical 与 hreflang alternates。

限制:资料仅提供 Next.js + next-intl 的实现示例,未说明其他框架或其他 i18n 库的用法;未提供收费、价格、平台支持范围与性能数据,这些内容暂未提供。