I18n-module: nuxt-i18n not working in production

[D4rkMindz]

Version

nuxt-i18n: 6.12.2
nuxt: 2.12.2

Nuxt configuration

mode:

• [x] universal (pwa)
• [ ] spa

Nuxt-i18n configuration

i18n: {
  strategy: 'prefix_except_default',
  defaultLocale: 'en',
  locales: [
    {
      code: 'en',
      iso: 'en-GB',
      name: 'English',
      file: 'en-GB.json',
    }, {
      code: 'de',
      iso: 'de-CH',
      name: 'Deutsch',
      file: 'de-CH.json',
    },
  ],
  vuex: {
    syncLocale: true,
    syncMessages: true,
  },
  // seo: true,
  lazy: true,
  langDir: 'assets/lang/',
},

Steps to reproduce

The problem is, that in a component, used in the layout (basically <layout><my-component></layout>) I use the this.$t('something') translation method and the this.$i18n. When running nuxt in development mode, everything works fine, but as soon as I run the application (NO CHANGES MADE) in production mode (nuxt build --pwa && npm run start) the app fails with following error: "o.localeRoute is not a function" (seems to be a problem in the renderer?). When having a look at the console, there is an error with following message: "Cannot read property 'locales' of undefined". The property that is tried to be read is this.$i18n and in dev mode it has the locale property.

What is Expected?

To work same as in development mode (running nuxt)

What is actually happening?

The application doesn't work anymore

PS: I had a look at following Issues/SOs:
Why nuxt-i18n module doesn't seem to be loaded? ( _vm.$t is not a function)

24

43

45

58

84

137

139 <- This one also happend to me, but as you see, i have my default locale set...

166

173

I also asked my question on the community discord.

So I'm really desperate...

[rchl]

localeRoute is a recent addition. I would think there is something messed up with your node_modules. Possibly a esm/babel cache is causing the issue. Try deleting node_modules and re-installing your dependencies.

The config looks correct and I'm pretty sure there is no such critical bug in the module or I would get a lot more bug reports. :)

[D4rkMindz]

I actually tried this one before, and just to be sure, i tried it right now and the problem still persists.
Its like the whole $i18n and $t is not available (in the computed properties, if this information might help). :)

[rchl]

Then the only way for me to look into it is if you make a reproducible testcase (as bug report template suggests :)).

[D4rkMindz]

I created a demo repository https://github.com/D4rkMindz/nuxt-i18n-error
Please clone it and run npm install
To see the development build: npm run dev
To see the production build: npm run start (not the best name...)

Thanks btw for your quick response :)

This is a censored version of the projekt (private...) I'm working on. So the docs aren't the best...

[rchl]

Please try those steps yourself first. :)

I have fixed it the way I thought it should be fixed but it doesn't reproduce so not sure if I've fixed it correctly.

[D4rkMindz]

Sorry, there was a Typo in the npm start command. I always executed npm run build && nuxt start and created npm run start for you. :)
I updated the command and executed it (even deleted node_modules again) and there's still the following error:
Error 1 in console (browser)

76f4293e102412530fcf.js:2 TypeError: Cannot read property 'locales' of undefined
    at f.availableLocales (3855662c55db675fe4ba.js:2)
    at bn.get (76f4293e102412530fcf.js:2)
    at bn.evaluate (76f4293e102412530fcf.js:2)
    at f.availableLocales (76f4293e102412530fcf.js:2)
    at f.navigation (3855662c55db675fe4ba.js:2)
    at bn.get (76f4293e102412530fcf.js:2)
    at bn.evaluate (76f4293e102412530fcf.js:2)
    at f.navigation (76f4293e102412530fcf.js:2)
    at f.<anonymous> (3855662c55db675fe4ba.js:2)
    at f.t._render (76f4293e102412530fcf.js:2)

Error 2 in console (browser)

TypeError: t.$t is not a function
    at f.<anonymous> (7b6c154cc9fd008adb42.js:1)
    at f.t._render (76f4293e102412530fcf.js:2)
    at f.r (76f4293e102412530fcf.js:2)
    at bn.get (76f4293e102412530fcf.js:2)
    at new bn (76f4293e102412530fcf.js:2)
    at t (76f4293e102412530fcf.js:2)
    at f.Tn.$mount (76f4293e102412530fcf.js:2)
    at init (76f4293e102412530fcf.js:2)
    at n (76f4293e102412530fcf.js:2)
    at 76f4293e102412530fcf.js:2

Sorry for being silly :/

[rchl]

The start command uses nuxt.config.beta.js configuration but that one doesn't include nuxt-i18n (it barely includes anything in fact). I guess your intention was to extend base config but you are not doing that.

[D4rkMindz]

Well it could not be more stupid. Thank you very much. Its always those simple things that are blocking...

Is there a patreon/PayPal/whatever for nuxt-i18n? I really need to compensate for this one...

[rchl]

There is nothing like that right now but I'm glad it worked. :)