Clash Royale CLAN TAG

Vuex unknown local mutation type, 'moduleName', global type: 'moduleName/moduleName'

I'm using Vuex in my Vue.js project.

Error message is the same, as the title:

Vuex unknown local mutation type, 'moduleName', global type: 'moduleName/moduleName'

All of my views(components) are displayed via <router-view></router-view>
and I want to dispatch an action when entering a specific route.

<router-view></router-view>

So, my App.vue looks like this:

<template>
<div id="app" class="wrapper">
<router-view></router-view>
</div>
</template>


I tried:

Importing the store to avoid using this.$store.dispatch. So it looked like this

/components/myComponent

import store from '../store'

...
beforeRouteEnter (to, from, next) {
next(vm => {
store.dispatch('moduleName/actionName', payload)
})
}


This didn't work. So I was like, whatever, I just watch a Vuex state, which I'm gonna commit at some point, and dispatch the action then, but, you know. Same problem.

Did look like this:

./store/modules/moduleName.js

const state = {
__init__: false
}

const mutations = {
initState (state, payload) {
state.__init__ = payload
}
}

./components/myComponent

...
computed: {
__init__ () {
if(this.$store.state.moduleName.__init__ === true) {
this.$store.dispatch('moduleName/actionName')
}
}
}


Funny thing: this.$store.state.moduleName.__init__ changes. So the computed property gets triggered. Also, if I console.log(this.$store), my action is listed under _actions: {moduleName/actionName}

this.$store.state.moduleName.__init__

console.log(this.$store)

_actions: {moduleName/actionName}

I'm really lost here and would appreciate any help I can get.

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.