Nuxt I18n

Internationalization (i18n) for Nuxt apps.

Features

Integration with vue-i18n
Route localization (static & dynamic)
Lazy load translations
SEO tag localization
Layer support

🚀 Usage

Install

Install the @nuxtjs/i18n module to your project

npx nuxi@latest module add i18n

Configure the module using the i18n key in nuxt.config.ts

{
  modules: [
    '@nuxtjs/i18n',
  ],
  i18n: {
    locales: [
      { code: 'en', language: 'en-US' },
      { code: 'fr', language: 'fr-FR' }
    ],
    defaultLocale: 'en',
  }
}

Edge Release Channel

Nuxt I18n lands commits, improvements and bug fixes every day, you can opt in to test these before their release using the edge release channel.

Opting In

Update @nuxtjs/i18n dependency inside package.json:

{
  "devDependencies": {
--    "@nuxtjs/i18n": "^8.0.0"
++    "@nuxtjs/i18n": "npm:@nuxtjs/i18n-edge"
  }
}

Remove lockfile (package-lock.json, yarn.lock, or pnpm-lock.yaml) and reinstall dependencies.

Opting Out

Update @nuxtjs/i18n dependency inside package.json:

{
  "devDependencies": {
--    "@nuxtjs/i18n": "npm:@nuxtjs/i18n-edge"
++    "@nuxtjs/i18n": "^8.0.0"
  }
}

Remove lockfile (package-lock.json, yarn.lock, or pnpm-lock.yaml) and reinstall dependencies.

Nuxt 2

Since Nuxt 2 has reached its end-of-life (EOL) date we are not actively maintaining support for this version, the last version to support Nuxt 2 is v7.

The codebase for this version can be found on the v7 branch and its documentation here.

🔗 Links

🔖 Release notes
👥 Community (🗨️❓ help support forum)