路由策略
Nuxt i18n 模块通过路由策略覆盖 Nuxt 默认路由,为每个 URL 添加语言环境前缀。
此功能基于 Nuxt 的路由 构建,需要你的项目有
pages 目录才能启用此功能。路由
Nuxt i18n 模块 覆盖 Nuxt 默认路由,为每个 URL 添加语言环境前缀('no_prefix' 策略除外)。
假设你的应用支持两种语言:法语和英语作为默认语言,并且你的项目中有以下页面:
-| pages/
---| about.vue
---| index.vue
---| posts/
-----| [id].vue
[
{
path: "/",
name: "index___en",
},
{
path: "/fr",
name: "index___fr",
},
{
path: "/about",
name: "about___en",
},
{
path: "/fr/about",
name: "about___fr",
},
{
path: "/posts/:id",
name: "posts-id___en",
},
{
path: "/fr/posts/:id",
name: "posts-id___fr",
}
]
请注意,英文版的路由没有任何前缀,因为它是默认语言,更多详细信息请参阅路由策略部分。
策略
支持 4 种策略,它们会影响应用路由的生成方式:
'no_prefix'
使用此策略,你的路由不会添加语言环境前缀。语言环境将在不改变 URL 的情况下检测和更改。这意味着你必须依赖浏览器和 cookie 检测,并通过调用 i18n API 实现语言环境切换。
'prefix_except_default'
使用此策略,除了默认语言之外,所有路由都将添加语言环境前缀。
'prefix'
使用此策略,所有路由都将带有语言环境前缀。
'prefix_and_default'
此策略结合了前两种策略的行为,这意味着你将获得所有语言都带有前缀的 URL,但默认语言的 URL 也将有一个无前缀版本(尽管在启用 detectBrowserLanguage 时将优先使用带前缀的版本)。
配置
要配置策略,请使用 strategy 选项。
请确保你已定义 defaultLocale,尤其是在使用 prefix_except_default、prefix_and_default 或 no_prefix 策略时。对于其他策略,也建议设置此项,因为它将在尝试从 404 页面重定向时用作回退。
nuxt.config.ts
export default defineNuxtConfig({
// ...
i18n: {
strategy: 'prefix_except_default',
defaultLocale: 'en'
}
// ...
})