How can I use i18n strategy in nuxt3?

Question

I use @nuxtjs/i18n with nuxt3 and I need to use strategy prefix_except_default. But it doesn't work.

My code:

package.json

{
  "name": "nuxt-app",
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@nuxt/devtools": "latest",
    "@nuxtjs/i18n": "^8.0.0-beta.12",
    "@types/node": "^18",
    "nuxt": "^3.5.2"
  }
}

nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    '@nuxtjs/i18n'
  ],
})

i18n.config.ts

export default defineI18nConfig(() => ({
  legacy: false,
  locale: 'en',
  messages: {
    en: {
      welcome: 'Welcome'
    },
    ua: {
      welcome: 'Ласкаво просимо'
    }
  },
  strategy: 'prefix_except_default',
  defaultLocale: 'en'
}))

Problem

I need

http://localhost:3000/

http://localhost:3000/ua

Answer 1

Accordingly to the documentation, not all the configurations go in i18n.config, but only the ones related to vuei18n.

The correct syntax is the following:

• nuxt.config.js

export default defineNuxtConfig({
  modules: [
    '@nuxtjs/i18n'
  ],
  i18n: {
    strategy: 'prefix_except_default',
    locales: [
      'en',
      'ua'
     ],
    defaultLocale: 'en',
    vueI18n: './i18n.config.js'
  }
})

• i18n.config.js

export default defineI18nConfig(() => ({
  legacy: false,
  locale: 'en',
  messages: {
    en: {
      welcome: 'Welcome'
    },
    ua: {
      welcome: 'Ласкаво просимо'
    }
  }
}))

See a working project here.

On stackblitz the paths are not visible unless you manually input them, but if you reproduce the project locally it will work.