Vuex action dispatch problem with electron

Question

I have electron app with vuex. Store is configured for whole app with modules, my test module Browser.js:

export default {
  namespaced: true,
  state: {
    currentPath: 'notSet'
  },
  mutations: {
    setPath (state) {
      state.currentPath = 'xxxx'
    }
  },
  actions: {
    updateCurrentPath ({ commit }) {
      console.log('COMMIT')
      commit('setPath')
    }
  },
  getters: {
    getCurrentPath (state) {
      return state.currentPath
    }
  }
}

Now inside component Im trying to dispatch update action with no success. Getters works fine:

mounted () {
  console.log('mounted')
  console.log('# GET FROM STORE:', this.$store.getters['Browser/getCurrentPath'])
  console.log('# DISPATCH:', this.$store.dispatch('Browser/updateCurrentPath'))
  console.log('# GET FROM STORE 2:', this.$store.getters['Browser/getCurrentPath'])
},

Console:

mounted
Browser.vue?31a5:62 # GET FROM STORE: notSet
Browser.vue?31a5:63 # DISPATCH: undefined
Browser.vue?31a5:64 # GET FROM STORE 2: notSet

Action exists, when I log this.$store variable I can see:

Store {_committing: false, _actions: {…}, _actionSubscribers: Array(0), _mutations: {…}, _wrappedGetters: {…}, …}
_actions:
Browser/updateCurrentPath

So how I should dispatch action?

Contemptuous

Answer 1

Problem was with electron plugin. Im using electron-vue repo from github, and there is a plugin used:

export default new Vuex.Store({
  modules,
  plugins: [
    createPersistedState(),
    createSharedMutations()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

createSharedMutations plugin was the problem. After commenting this out, everything works fine:

export default new Vuex.Store({
  modules,
  plugins: [
    createPersistedState()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

Contemptuous

I Spent hours on this! – Bide

Me too :) Im glad if I could help – Contemptuous

Damn you saveed my day – Papillon

Answer 2

If you use vue-electron template with vuex-electron plugin, you need to add following line in your src/main/index.js file

import store from '../renderer/store'

Knepper

Answer 3

In case if you enabled createSharedMutations() plugin you need to create an instance of store in the main process. To do it just add this line into your main process (for example src/main.js):

import './path/to/your/store'link to official plug used by electron-vue which is causing this issue

Jada