Can't load the nuxt-i18n module in Nuxt 2.0 project : SyntaxError: Unexpected character '@'

[kevinmarrec]

I'm not being able to make Nuxt-i18n working with a fresh Nuxt 2.0 project. I got this error :

My nuxt.config.js

export default {
  head: {
    title: 'Name App',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Description' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  loading: { color: '#FFFFFF' },
  modules: [
    ['nuxt-i18n', {

    }]
  ],
  css: [
    '~/assets/style/app.styl'
  ],
  build: {
    extractCSS: true
  }
}

Did something break since Nuxt 2.0 ?

_{This question is available on Nuxt community (#c136)}

[ghost]

This issue as been imported as question since it does not respect nuxt-i18n issue template. Only bug reports and feature requests stays open to reduce maintainers workload. If your issue is not a question, please mention the repo admin or moderator to change its type and it will be re-opened automatically. Your question is available at https://cmty.app/nuxt/nuxt-i18n/issues/c136.

[michaelwills]

I just ran into this as well @kevinmarrec. Looks like it's because I have been using Typescript with the @Component decorator.

[michaelwills]

https://github.com/nuxt-community/nuxt-i18n/issues/76

[michaelwills]

So parsePages: false in nuxt.config.js allows it to not parse the typescript pages. I'll have to test to see how that impacts the build though..

[kevinmarrec]

@michaelwills Yes I'm using @Component decorators. Indeed, I went with parsePages: false to make it working. But yeah I don't know either if it impacts something.

I had the solution few days ago but as the Bot automatically closed my issue, I forgot to give my feedback, sorry 😄.

Maybe a "Known issues" section in the NuxtI18n documentation could be great, to directly refer this kind of problem (which may be resolved later). I also needed to disable the seo option to not have problem with third parties (see https://github.com/nuxt-community/nuxt-i18n/issues/100)

[michaelwills]

That gets it building but accessing data seems to be different now…

[michaelwills]

Still dealing with Property "$i18n" does not exist on type "Component name".

[michaelwills]

@kevinmarrec I replaced my custom modules/typescript.ts with the nuxt-ts package. A couple of other changes are

• change langFile to file otherwise it wouldn't find the lang file
• change loadLanguagesAsync to lazy

[kevinmarrec]

@michaelwills I never had this Property "$i18n" does not exist on type "Component name" error, and I already have file and lazy options. I don't know if the properties you are talking about were existing before but if it's the case I think you had some old Nuxt I18n version, your last message looks like migration guidelines.

[andrejs-uibo]

Still dealing with Property "$i18n" does not exist on type "Component name".

Is there any solution to this issue?

[kevinmarrec]

@andrejs-uibo Please create a new issue, this one is closed & almost 1 year old, thanks.