baseUrl
string
or function
''
The fallback base URL to use as a prefix for alternate URLs in hreflang
tags. By default VueRouter's base URL will be used and only if that is not available, fallback URL will be used.
Can also be a function (will be passed a Nuxt Context as a parameter) that returns a string. Useful to make base URL dynamic based on request headers.
This property can also be set using runtimeConfig
.
locales
array
[]
List of locales supported by your app. Can either be an array of codes (['en', 'fr', 'es']
) or an array of objects for more complex configurations:
[
{ "code": "en", "language": "en-US", "file": "en.js", "dir": "ltr" },
{ "code": "ar", "language": "ar-EG", "file": "ar.js", "dir": "rtl" },
{ "code": "fr", "language": "fr-FR", "file": "fr.js" }
]
When using an object form, the properties can be:
code
(required) - unique identifier of the localelanguage
(required when using SEO features) - A language-range used for SEO features and for matching browser locales when using detectBrowserLanguage
functionality. Should use the language tag syntax as defined by the IETF's BCP47, for example:
'en'
(language
subtag for English)'fr-CA'
(language+region
subtags for French as used in Canada)'zh-Hans'
(language+script
subtags for Chinese written with Simplified script)file
- The name of the file. Will be resolved relative to langDir
path when loading locale messages from file.files
- The name of the file in which multiple locale messages are defined. Will be resolved relative to langDir
path when loading locale messages from file.dir
- The dir property specifies the direction of the elements and content, value could be 'rtl'
, 'ltr'
or 'auto'
.domain
(required when using differentDomains
) - the domain name you'd like to use for that locale (including the port if used). This property can also be set using runtimeConfig
.domainDefault
(required when using differentDomains
while one or more of the domains having multiple locales) - set domainDefault
to true
for each locale that should act as a default locale for the particular domain.domains
(required when using multiDomainLocales
while one or more of the domains having multiple of the same locales) - an array of domain
.defaultForDomains
(optional when using multiDomainLocales
) - an array of domain
for which the locale should be the default locale when using domains
....
- any custom property set on the object will be exposed at runtime. This can be used, for example, to define the language name for the purpose of using it in a language selector on the page.You can access all the properties of the current locale through the localeProperties
property. When using an array of codes, it will only include the code
property.
defaultDirection
string
ltr
The app's default direction. Will only be used when dir
is not specified.
defaultLocale
string
or null
null
The app's default locale. Should match code of one of defined locales
.
When using prefix_except_default
strategy, URLs for locale specified here won't have a prefix. It's recommended to set this to some locale regardless of chosen strategy, as it will be used as a fallback locale when navigating to a non-existent route.
strategy
string
'prefix_except_default'
Routes generation strategy. Can be set to one of the following:
'no_prefix'
: routes won't have a locale prefix'prefix_except_default'
: locale prefix added for every locale except default'prefix'
: locale prefix added for every locale'prefix_and_default'
: locale prefix added for every locale and defaultcustomRoutes
string
(page
or config
) | undefined
page
Whether custom paths are extracted from page files
pages
object
{}
If customRoutes
option is disabled with config
, the module will look for custom routes in the pages
option. Refer to the Routing for usage.
skipSettingLocaleOnNavigate
boolean
false
If true
, the locale will not be set when navigating to a new locale. This is useful if you want to wait for the page transition to end before setting the locale yourself using finalizePendingLocaleChange
. See more information in Wait for page transition.
defaultLocaleRouteNameSuffix
string
'default'
Internal suffix added to generated route names for default locale, if strategy is prefix_and_default
. You shouldn't need to change this.
routesNameSeparator
string
'___'
Internal separator used for generated route names for each locale. You shouldn't need to change this.
rootRedirect
string
or object
or null
null
Set to a path to which you want to redirect users accessing the root URL (/
). Accepts either a string or an object with statusCode
and path
properties. E.g
{
"statusCode": 301,
"path": "about-us"
}
dynamicRouteParams
boolean
false
Whether to localize dynamic route parameters.
If true
, you can set the dynamic route parameter to nuxtI18n
field of definePageMeta
for each locale:
export default defineNuxtConfig({
modules: ['@nuxtjs/i18n'],
i18n: {
dynamicRouteParams: true
}
})
<script setup>
definePageMeta({
nuxtI18n: {
en: { id: 'my-post' },
fr: { id: 'mon-article' }
}
})
</script>
<template>
<!-- pages/post/[id].vue -->
</template>
See more information in Dynamic route parameters