I18n Integration

Site Config integrates automatically with both @nuxtjs/i18n and nuxt-i18n-micro. You do not need extra configuration; Site Config detects and enables the integration when your app installs either module.

Usage

Site Config extracts the following properties from your i18n module config:

• url - The base URL, configured as baseUrl in the i18n module. It overrides site.url, and NUXT_SITE_URL overrides it.
• defaultLocale - The default locale language (e.g. en-US) resolved from the i18n module config.
• currentLocale - The current locale for the request, resolved from the locale's language property. Falls back to defaultLocale if no locale is set.

For example, consider the following config:

export default defineNuxtConfig({
  i18n: {
    baseUrl: 'https://example.com',
    defaultLocale: 'en',
    locales: [
      { code: 'en', language: 'en-US' },
      { code: 'fr', language: 'fr-FR' },
    ],
  },
})

The following site config will be inferred:

{
  "url": "https://example.com",
  "defaultLocale": "en-US",
  "currentLocale": "en-US"
}

Translated Site Config

Both @nuxtjs/i18n and nuxt-i18n-micro support providing translated site config values through a nuxtSiteConfig translation key:

• name - Name of the site
• description - Description of the site

For example:

export default {
  nuxtSiteConfig: {
    name: 'My Site',
    description: 'My site description',
  }
}

{
  "nuxtSiteConfig": {
    "name": "My Site",
    "description": "My site description"
  }
}

The following site config will be inferred for an English request:

{
  "url": "https://example.com",
  "defaultLocale": "en-US",
  "currentLocale": "en-US",
  "name": "My Site",
  "description": "My site description"
}

Module Ordering

The order of @nuxtjs/i18n (or nuxt-i18n-micro) and nuxt-site-config in the modules array does not matter. Site Config declares the i18n modules as dependencies, so Nuxt sets up i18n first.