未捕获的错误：[vuex] getters应该起作用，但是“ getters.default”是{}

Question

I recently build my VUE project for production using NPM, however in the console i get the following error. Does anyone have any idea why vuex is complaining ? npm 3.10 , node.js 8.11,

Uncaught Error: [vuex] getters should be function but "getters.default" is {}.
at assert (vuex.esm.js:97)
at vuex.esm.js:271
at vuex.esm.js:85
at Array.forEach (<anonymous>)
at forEachValue (vuex.esm.js:85)
at vuex.esm.js:270
at Array.forEach (<anonymous>)
at assertRawModule (vuex.esm.js:265)
at ModuleCollection.register (vuex.esm.js:191)
at new ModuleCollection (vuex.esm.js:165)

thank you Tonathiu

Answer 1

I assume you have a function(getter) inside getters of vuex and you are trying to call it using something like

store.getters.default()

Which is a wrong way to do so, and you will get some errors log like that.

So the correct way is to use vuex's mapGetters inside the computed property of the vue component. which would look something like this in the code.

import { mapGetters } from 'vuex'
...
...
  computed:{
            ...mapGetters(['default'])
        },
...
...

And then try calling default getter using this(vm instance) like

this.default()

That's all it should work now.

I hope it helps.