Cannot read property 'hasOwnProperty' of undefined

[mboisvertdupras]

Hey, I'm new to Vue/Vuex and I'm trying to use this but I'm having some issues.

I'm loading Vuex in a separate directory/file from my main app.js like so:

// store/index.js

import Vue from 'vue'
import Vuex from 'vuex'
import vuexI18n from 'vuex-i18n'

Vue.use(vuexI18n.plugin, Vuex)

export default new Vuex.Store({
  //
})

And in my main app.js

import store from './store'
const app = new Vue({
    router: router,
    store: store,
    el: '#app'
})

This throws a Uncaught TypeError: Cannot read property 'hasOwnProperty' of undefined error. Any ideas on how I can make this work?

[tikiatua]

Hi there,

Thank you for your question. The problem might be due to the fact, that I forgot to update the npm package to the latest version - for which the readme describes the setup.

You still need to register the i18n module when initializing the store in the current npm version.

Please register the module as follows:

export default new Vuex.Store({
	modules: {
		i18n: vuexI18n.store
	}
});

Please let me know if this solves the problem.

[mboisvertdupras]

Thank you for the quick answer! Should I just download the source and use it directly?

I got it working this way however I'm probably not doing it correctly:

Vue.use(Vuex)

const store = new Vuex.Store({
  modules: {
    i18n: vuexI18n.store
  }
})

Vue.use(vuexI18n.plugin, store)

const translationsEn = {
	"content": "This is some {type} content"
}

const translationsDe = {
	"My nice title": "Ein schöner Titel",
	"content": "Dies ist ein toller Inhalt"
}

Vue.i18n.add('en', translationsEn)
Vue.i18n.add('de', translationsDe)

Vue.i18n.set('en')

export default store

[tikiatua]

You could use the source from the repo directly, I will however update the npm package probably later today.

The only difference is the initialization of the module.

Your code looks good to me. Vuex uses one "giant" object as state tree and the vuex-i18n plugin only adds a specific i18n property to store the translation to the state tree and provides some convenience functions to access the translations.

[mboisvertdupras]

Alright, thank you for all your help! I will wait until the package is updated.