Nuxt•9mo ago

i18n [plugin:nuxtjs:i18n-resource] Cannot read properties of undefined (reading 'options')

I downloaded NuxtI18n, added

  i18n: {
    vueI18n: './i18n.config.ts' ,
    bundle: {
      optimizeTranslationDirective: false,
    },
    locales: [
      { code: 'en', language: 'en-US' },
      { code: 'nl', language: 'nl-NL' }
    ],
    defaultLocale: 'en',
  },

  i18n: {
    vueI18n: './i18n.config.ts' ,
    bundle: {
      optimizeTranslationDirective: false,
    },
    locales: [
      { code: 'en', language: 'en-US' },
      { code: 'nl', language: 'nl-NL' }
    ],
    defaultLocale: 'en',
  },

to my nuxt.config.ts, and

export default defineI18nConfig(() => ({
    legacy: false,
    locale: 'en',
    messages: {
      en: {
        welcome: 'Welcome'
      },
      nl: {
        welcome: 'Welkom'
      }
    }
}));

export default defineI18nConfig(() => ({
    legacy: false,
    locale: 'en',
    messages: {
      en: {
        welcome: 'Welcome'
      },
      nl: {
        welcome: 'Welkom'
      }
    }
}));

to i18n/i18n.config.ts, but I have error [plugin:nuxtjs:i18n-resource] Cannot read properties of undefined (reading 'options') /Users/uzyxen/Desktop/active-projects/<project-name>/i18n/i18n.config.ts

kapa.ai•3/25/25, 7:17 PM

Hi @Uzyxen. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base.

kapa.ai•3/25/25, 7:18 PM

----------------------
Based on the error you're encountering, there seems to be an issue with your i18n configuration. The error "[plugin:nuxtjs:i18n-resource] Cannot read properties of undefined (reading 'options')" typically occurs when there's a mismatch in your configuration setup.

Here are a few issues I can identify:

Your i18n configuration file is in the wrong location. According to your error message, you have it at , but in your Nuxt config, you're referencing it as .
Several users have reported similar issues when upgrading Nuxt or the i18n module, as seen in this GitHub issue.

Here's how to fix it:

Move your i18n.config.ts file to the root directory of your project (same level as nuxt.config.ts)
Make sure your nuxt.config.ts points to the correct location:

If you're still having issues, try simplifying your configuration. Based on this Stack Overflow solution, a minimal working configuration would be:

kapa.ai•3/25/25, 7:18 PM

If you're still experiencing issues, it might be related to version compatibility between Nuxt and the i18n module. Make sure you're using compatible versions, as some users have reported needing to update both Nuxt and the i18n module to resolve similar errors.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•3/25/25, 7:18 PM

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

Hugo•3/25/25, 7:22 PM

@Uzyxen Your must be in the root, not in an i18n folder

UzyxenOP•3/25/25, 7:24 PM

when I moved i18n.config.ts to the root I get the message [@nuxtjs/i18n 8:22:47 PM] WARN Vue I18n configuration file ./i18n.config.ts not found in /Users/uzyxen/Desktop/active-projects/<project-name>/i18n. Skipping... @kapa.ai

kapa.ai•3/25/25, 7:24 PM

Let me check the knowledge base for you again. One moment!

kapa.ai•3/25/25, 7:25 PM

----------------------
Based on the warning message you're receiving, it seems that the i18n module is still looking for your configuration file in the wrong location. The warning indicates it's searching for inside an directory, but you've moved it to the root directory as suggested.

There are a couple of ways to fix this issue:

Make sure your path in the Nuxt config is correct. If your file is in the root directory, try using an absolute path reference:

The

alias in Nuxt refers to the project root directory, which should help resolve the path correctly.

Alternatively, you could try using a relative path with proper notation:

This issue is similar to what was discussed in this GitHub issue, where aliases inside certain Nuxt configurations weren't resolving correctly.

If you're using a recent version of Nuxt (3.16+) and i18n (9.x+), be aware that there have been some structural changes in how i18n works. According to this GitHub comment, from i18n v9.x, it's expected that you have your i18n folder outside the app directory.

You might also want to check if you need to add the option to your i18n config if you're using a specific directory structure, as mentioned in this GitHub comment.

If these solutions don't work, please share your Nuxt and i18n versions so I can provide more specific guidance.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•3/25/25, 7:25 PM

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

Hugo•3/25/25, 7:26 PM

@Uzyxen You can look at this repo if you like for the i18n config, but be careful, it uses compatibility v4 (the new Nuxt 4 structure)
https://github.com/HugoRCD/canvas

GitHub

GitHub - HugoRCD/canvas: Portfolio template made with Nuxt 3, Nuxt ...

Portfolio template made with Nuxt 3, Nuxt Content v3, NuxtUI v3 and TailwindCSS v4 - HugoRCD/canvas

UzyxenOP•3/25/25, 7:30 PM

Thank You, I'll see it soon

UzyxenOP•3/25/25, 7:39 PM

idk what im doing wrong.

i18n.config.ts in the root:

export default defineI18nConfig(() => ({
    legacy: false,
    locale: 'en',
    messages: {
      en: {
        welcome: 'Welcome'
      },
      nl: {
        welcome: 'Welkom'
      }
    }
}));

export default defineI18nConfig(() => ({
    legacy: false,
    locale: 'en',
    messages: {
      en: {
        welcome: 'Welcome'
      },
      nl: {
        welcome: 'Welkom'
      }
    }
}));

and nuxt.config.ts:

and im still getting:

@kapa.ai

kapa.ai•3/25/25, 7:39 PM

Let me check the knowledge base for you again. One moment!

kapa.ai•3/25/25, 7:40 PM

----------------------
Based on the error message you're seeing, there seems to be an issue with how the i18n module is trying to load your configuration file. Let's address this problem step by step.

The error "Cannot read properties of undefined (reading 'options')" suggests that the i18n module can't properly parse your configuration file. This is a common issue that several users have encountered when setting up Nuxt with i18n.

Here are some potential solutions:

Update your i18n configuration in nuxt.config.ts:

Try simplifying your i18n configuration in nuxt.config.ts to just point to the config file:

The

alias sometimes doesn't work correctly in this context, as seen in similar issues. Using a relative path like might work better.

Check your package versions:

This could be a version compatibility issue. According to this GitHub issue comment, some users had to upgrade both Nuxt and the i18n module to resolve similar errors. Make sure you're using compatible versions.

Try restructuring your i18n setup:

If you're using i18n v9.x, there have been directory structure changes. As mentioned in this GitHub comment, you might need to:

Move all i18n files to
Or add `restructureDir: false` to your i18n config
**Ensure your i18n.config.ts is correctly formatted**:

Your i18n.config.ts looks correct, but make sure it's being properly exported and that there are no syntax errors.

Try a completely fresh approach:

Based on this Stack Overflow solution, you could try:

kapa.ai•3/25/25, 7:40 PM

And keep your i18n.config.ts as is.

If you're still experiencing issues after trying these solutions, it might be helpful to check which version of Nuxt and i18n you're using, as there have been significant changes between versions that could affect how configuration works.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•3/25/25, 7:40 PM

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

UzyxenOP•3/25/25, 7:55 PM

I added older version (8.0.0) and it works