i18n inside plugin

How to access the I18n instance inside a plugin?
I have a plugin that fetches global data for my app from a backend, and I need to use the locale.

I cant import it from the composable...

error caught during app initialization SyntaxError: Must be called at the top of a setup function

error caught during app initialization SyntaxError: Must be called at the top of a setup function

... Even though the plugin is inside a

setup

setup

function...

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup() {
    const { locale } = useI18n()
    // ...
  }
})

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup() {
    const { locale } = useI18n()
    // ...
  }
})

I can't use use it from nuxtApp, because I18n is not there yet...

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup(nuxtApp) {
    const { locale } = nuxtApp.$i18n
    // ...
  }
})

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup(nuxtApp) {
    const { locale } = nuxtApp.$i18n
    // ...
  }
})

(This solution is inconsistent in development, but fails 100% in production.)

How do I make sure i18n is loaded before my plugin?

Nuxt•3y ago•

6 replies

lkjimy

i18n inside plugin

How to access the I18n instance inside a plugin?
I have a plugin that fetches global data for my app from a backend, and I need to use the locale.

I cant import it from the composable...

error caught during app initialization SyntaxError: Must be called at the top of a setup function

error caught during app initialization SyntaxError: Must be called at the top of a setup function

... Even though the plugin is inside a

setup

setup

function...

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup() {
    const { locale } = useI18n()
    // ...
  }
})

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup() {
    const { locale } = useI18n()
    // ...
  }
})

I can't use use it from nuxtApp, because I18n is not there yet...

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup(nuxtApp) {
    const { locale } = nuxtApp.$i18n
    // ...
  }
})

export default defineNuxtPlugin({
  name: 'fetch-global-information',
  enforce: 'pre',
  async setup(nuxtApp) {
    const { locale } = nuxtApp.$i18n
    // ...
  }
})

(This solution is inconsistent in development, but fails 100% in production.)

How do I make sure i18n is loaded before my plugin?

i18n inside plugin

Similar Threads

i18n inside plugin

Similar Threads

Similar Threads

Similar Threads