Learn Nuxt with a Collection of 100+ Tips!

i18n
i18n

i18n features for your Nuxt project so you can easily add internationalization.

Nuxt i18n

Volta board

Nuxt I18n

Internationalization (i18n) for Nuxt apps.

📖 Read documentation

Features

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

🚀 Usage

Install

  1. Install the @nuxtjs/i18n module to your project
npx nuxi@latest module add i18n
  1. Configure the module using the i18n key in nuxt.config.ts
{
  modules: [
    '@nuxtjs/i18n',
  ],
  i18n: {
    locales: [
      { code: 'en', iso: 'en-US' },
      { code: 'fr', iso: '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.

©️ License

MIT License - Copyright (c) Nuxt Community