Nuxt•2w ago

Nuxtjs/I18n not initialising properly

We used the nuxtjs/i18n v8.0.0-rc3, and now started upgrading to v9.2.1. We are using Nuxt v3.8.0. On trying to initialise the library in Nuxt solution we am getting different errors. I've tried everything I could and I can't seem to figure out what I'm doing wrong. in nuxt.config.js we defined the modules:

modules: [
    '@nuxtjs/i18n',
    './modules/01_defineRuntimePlugins',
    'nuxt-primevue',
    '@pinia/nuxt',
  ],

modules: [
    '@nuxtjs/i18n',
    './modules/01_defineRuntimePlugins',
    'nuxt-primevue',
    '@pinia/nuxt',
  ],

I then continue to define the configuration for i18n as so:

i18n: {
    defaultLocale: 'nl-be',
    locales: [
      { code: 'nl-be', name: 'Nederlands (België)', file: 'nl-be.js', dir: 'ltr' },
      { code: 'fr-be', name: 'Français (Belgique)', file: 'fr-be.js', dir: 'ltr' },
      { code: 'en-be', name: 'English (Belgium)', file: 'en-be.js', dir: 'ltr' },
      { code: 'fr-fr', name: 'Français (France)', file: 'fr-fr.js', dir: 'ltr' },
      { code: 'en-fr', name: 'English (France)', file: 'en-fr.js', dir: 'ltr' },
    strategy: 'prefix',
    lazy: true,
    vueI18n: './nuxt-i18n.js',
  },

i18n: {
    defaultLocale: 'nl-be',
    locales: [
      { code: 'nl-be', name: 'Nederlands (België)', file: 'nl-be.js', dir: 'ltr' },
      { code: 'fr-be', name: 'Français (Belgique)', file: 'fr-be.js', dir: 'ltr' },
      { code: 'en-be', name: 'English (Belgium)', file: 'en-be.js', dir: 'ltr' },
      { code: 'fr-fr', name: 'Français (France)', file: 'fr-fr.js', dir: 'ltr' },
      { code: 'en-fr', name: 'English (France)', file: 'en-fr.js', dir: 'ltr' },
    strategy: 'prefix',
    lazy: true,
    vueI18n: './nuxt-i18n.js',
  },

Translation files in the i18n/locales/ folder (nl-be.js):

export default defineI18nLocale(async (locale) => {
  return {
    welcome: 'Welkom, Welkom!',
  }
})

export default defineI18nLocale(async (locale) => {
  return {
    welcome: 'Welkom, Welkom!',
  }
})

At the same level as the nuxt.config.js file, I have the nuxt-i18n.js file defined as so:

export default {
    datetimeFormats: {
      'en-be': {
        short: { year: 'numeric', month: 'short', day: 'numeric' },
      },
      'nl-be': {
        short: { year: 'numeric', month: 'short', day: 'numeric' },
      },
    },
}

export default {
    datetimeFormats: {
      'en-be': {
        short: { year: 'numeric', month: 'short', day: 'numeric' },
      },
      'nl-be': {
        short: { year: 'numeric', month: 'short', day: 'numeric' },
      },
    },
}

After then starting the Nuxt project, i get this error: ERROR Cannot start nuxt: Cannot create property 'locales' on string '[object Object]' So I tried pasting the object directly in the vueI18n instead of the path to the file, and when doing so, I receive the error: ERROR Cannot start nuxt: input.replace is not a function I am completely out of idea's, I got no idea what I need to do to solve this issue. Any help is greatly appreciated!

3 Replies

kapa.ai•2w ago

Hi @Dennis - Platowner. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the information provided in the knowledge sources and your question, it seems you're encountering issues with the configuration of @nuxtjs/i18n in your Nuxt project. Let me provide some guidance based on the available information: 1. First, make sure you're using the latest stable version of @nuxtjs/i18n. As of the knowledge sources, the latest version mentioned is 8.0.0-rc.5, but you're using 9.2.0. This version difference might be causing some compatibility issues. 2. The configuration structure in your nuxt.config.js seems to have some issues. Here's a corrected version based on the Stack Overflow post about i18n configuration:

export default defineNuxtConfig({
  modules: ['@nuxtjs/i18n'],
  i18n: {
    vueI18n: './nuxt-i18n.js'
  }
})

export default defineNuxtConfig({
  modules: ['@nuxtjs/i18n'],
  i18n: {
    vueI18n: './nuxt-i18n.js'
  }
})

3. Move your i18n configuration from nuxt.config.js to a separate i18n.config.ts file. This approach is recommended in the Stack Overflow post about i18n not working after Nuxt update. Your i18n.config.ts should look something like this:

export default defineI18nConfig(() => ({
  defaultLocale: 'nl-be',
  locales: [
    { code: 'nl-be', name: 'Nederlands (België)', file: 'nl-be.js', dir: 'ltr' },
    { code: 'fr-be', name: 'Français (Belgique)', file: 'fr-be.js', dir: 'ltr' },
    { code: 'en-be', name: 'English (Belgium)', file: 'en-be.js', dir: 'ltr' },
    { code: 'fr-fr', name: 'Français (France)', file: 'fr-fr.js', dir: 'ltr' },
    { code: 'en-fr', name: 'English (France)', file: 'en-fr.js', dir: 'ltr' }
  ],
  strategy: 'prefix',
  lazy: true,
  langDir: 'locales',
  // Add your datetime formats here if needed
}))

export default defineI18nConfig(() => ({
  defaultLocale: 'nl-be',
  locales: [
    { code: 'nl-be', name: 'Nederlands (België)', file: 'nl-be.js', dir: 'ltr' },
    { code: 'fr-be', name: 'Français (Belgique)', file: 'fr-be.js', dir: 'ltr' },
    { code: 'en-be', name: 'English (Belgium)', file: 'en-be.js', dir: 'ltr' },
    { code: 'fr-fr', name: 'Français (France)', file: 'fr-fr.js', dir: 'ltr' },
    { code: 'en-fr', name: 'English (France)', file: 'en-fr.js', dir: 'ltr' }
  ],
  strategy: 'prefix',
  lazy: true,
  langDir: 'locales',
  // Add your datetime formats here if needed
}))

4. Make sure your nuxt-i18n.js file is correctly formatted. The content you provided seems correct, but ensure it's properly exported. 5. For your locale files, the structure seems correct. Just ensure they are in the correct directory as specified in your i18n configuration. If you still encounter issues after making these changes, it might be worth considering downgrading to a stable version of @nuxtjs/i18n that is known to work with your Nuxt version. The knowledge sources don't provide information about version 9.2.0, so there might be undocumented changes or issues with this version. Remember to restart your Nuxt application after making these changes. If the problem persists, you may need to clear your cache or node_modules and reinstall dependencies. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2w ago

<@743759267462643782> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Dennis - PlatownerOP•2w ago

The full stack trace, in case it might be relevant:

 ERROR  Cannot start nuxt:  Cannot create property 'locales' on string '[object Object]'                                                                                                15:40:17  

  at prepareRuntime (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/dist/module.mjs:1995:50)
  at setup (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/dist/module.mjs:2234:5)
  at async normalizedModule (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/node_modules/@nuxt/kit/dist/index.mjs:2149:17)
  at async installModule (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxt/node_modules/@nuxt/kit/dist/index.mjs:2439:95)
  at async initNuxt (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxt/dist/index.mjs:3655:7)
  at async NuxtDevServer._load (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:255:5)
  at async NuxtDevServer.load (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:187:7)
  at async NuxtDevServer.init (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:182:5)
  at async Object.run (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev-child.mjs:103:5)
  at async runCommand$1 (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/shared/nuxi.c6444792.mjs:1647:7)

 ERROR  Cannot start nuxt:  Cannot create property 'locales' on string '[object Object]'                                                                                                15:40:17  

  at prepareRuntime (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/dist/module.mjs:1995:50)
  at setup (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/dist/module.mjs:2234:5)
  at async normalizedModule (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/@nuxtjs/i18n/node_modules/@nuxt/kit/dist/index.mjs:2149:17)
  at async installModule (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxt/node_modules/@nuxt/kit/dist/index.mjs:2439:95)
  at async initNuxt (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxt/dist/index.mjs:3655:7)
  at async NuxtDevServer._load (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:255:5)
  at async NuxtDevServer.load (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:187:7)
  at async NuxtDevServer.init (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev2.mjs:182:5)
  at async Object.run (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/chunks/dev-child.mjs:103:5)
  at async runCommand$1 (/C:/Users/dennis/Documents/gad/Projects/gad/frontend/node_modules/nuxi/dist/shared/nuxi.c6444792.mjs:1647:7)

Gaming

Programming

Nuxtjs/I18n not initialising properly

Did you find this page helpful?