Implement vuex-i18n together with Nuxt.js (SyntaxError Unexpected token export) about vuex-i18n HOT 9 CLOSED

Hi @infinite-dao,

Please try using import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js'; to load the vuex-i18n plugin.

We changed the default file to the es-version, which is probably why you are seeing the token error message.

from vuex-i18n.

Indeed import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js'; brings the translations to work.

Thanks @tikiatua

from vuex-i18n.

Great. I will add a respective comment to the readme file tomorrow

from vuex-i18n.

Hi, got the same error. Using VueJS together with VuetifyJS.

import vuexI18n from 'vuex-i18n'
Uncaught SyntaxError: Unexpected token export

import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js'
vuex-i18n.umd.js?65ee:388 i18n vuex module is not correctly initialized. Please check the module name: i18n
main.js?3b76:23 Uncaught TypeError: Cannot read property 'add' of undefined

from vuex-i18n.

Hi @SgtPepper27,

Thank you for reporting this. Could you please indicate the version of vuex-i18n that you are using and post the part of the main file where you are initializing the module.

// as example 
import Vue from 'vue';
import Vuex from 'vuex';
import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js';

const store = new Vuex.Store();
Vue.use(vuexI18n.plugin, store);

from vuex-i18n.

Version: 1.10.1

index.js (Store):

import Vue from 'vue'
import Vuex from 'vuex'
import { vuex } from '../modules'
import vuexI18n from 'vuex-i18n/dist/vuex-i18n.umd.js'
import translationEN from '../languages/locale-en.json'

Vue.use(Vuex)

const debug = process.env.NODE_ENV !== 'production'

const store = new Vuex.Store({
  modules: vuex,
  strict: debug
})

Vue.use(
  vuexI18n.plugin,
  store,
  {
    onTranslationNotFound: function (locale, key) {
      console.warn(`vuex-i18n :: Key '${key}' not found for locale '${locale}'`)
    }
  })

// register the locales
Vue.i18n.add('en', translationEN)

// Set the start locale to use
Vue.i18n.set('en')

export default store
  

from vuex-i18n.

Strange. The code looks fine to me so far (although I would not use Vuex and vuex as variables).

Are you using server-side-rendering or running this in the browser?

Please try the following things:

1. use the latest version of vuex.i18n (1.10.1). In this version the plugin is properly name-spaced and preserves existing module state. Maybe this was a source of the problem. If you already started with this version, please try to use version 1.9.0.

2. make sure you run an up-to-date version of vuex (just to be sure).

3. try to specify the module name explicitly with the option moduleName. The configuration should actually be merged, but maybe something does not work correctly with Object.extend().

Vue.use(vuexI18n.plugin, store, {
	moduleName: 'i18n',
	onTranslationNotFound: ...
)

from vuex-i18n.

Hey,

Thanks for the quick reply. Using this with VueJS/VuetifyJS as an electron app.

Your advice of using version 1.9.0 works for me. Last thing i have to check is, if i am using the last version of vuex but for the moment i am happy

from vuex-i18n.

Thank you for the feedback. This means we broke something with 1.10. I will take a look at the differences between the versions.

from vuex-i18n.