08 国际化
8.1 配置位置
国际化由 @nuxtjs/i18n 提供,配置位于 nuxt.config.ts,语言定义集中在 app/shared/localeConfig.ts。
当前语言:
| code | 资源文件 | 接口 country_code |
|---|---|---|
zh | zh-CN.json | zh-CN |
en | en-US.json | en-CN |
ar | ar.json | ar-SA |
zhtw | zh-TW.json | zh-TW |
默认语言为 zh,非默认语言使用 prefix_except_default 策略。
8.2 语言资源
资源位于 app/locales/,启用懒加载。页面和组件中使用 useI18n() 获取 t、locale 等能力,不要硬编码用户可见文案。
ts
const { t } = useI18n()
const title = computed(() => t('some.key'))8.3 语言码规范化
normalizeLocaleCode() 会统一大小写并优先识别完整代码,例如 zhtw,再处理带区域的代码。新增语言时应同时补充:
LOCALE_DEFINITIONS。- 对应资源文件。
- 接口使用的
apiCountryCode。 - 页面语言切换和 RTL 相关验证。
8.4 接口语言参数
HTTP 插件根据当前 i18n locale 或 i18n_redirected Cookie 计算 country_code,统一注入请求 query 或 body。接口需要特殊语言参数时,应通过请求选项明确覆盖或跳过,不要在页面中重复拼接默认值。
8.5 路由与切换
使用 useLocalePath() 生成本地化路径,避免手写语言前缀。语言切换后应验证:
- 当前页面路径是否正确。
- 非默认语言是否带前缀。
- 登录重定向参数是否保留语言路径。
- RTL 语言的布局、图标方向和文本对齐是否正常。
