vuex-module-decorators: Namespaces do not function. Throws "ERR_ACTION_ACCESS_UNDEFINED" when using namespaces

@Action({ rawError: true }) You can add this to the decorator. I think the decorator catches every error that happens inside the action and just give you this error. I had the same thing.

Edit: turns out there was a problem with my main component class and after I fixed it, the problem went away.

I’m getting this same error when trying to namespace modules. Without namespacing everything works fine.

My super simple store:

@Module({ namespaced: true, name: 'hoyci' })
export default class HoyciModule extends VuexModule {
  year = 0

  @Mutation
  setYear(year: number) {
    this.year = year
  }

  @Action({})
  init() {
    const d = new Date()
    this.context.commit('setYear', d.getFullYear())
  }
}

If I add rawError: true I get: “Unhandled promise rejection Error: “ERR_STORE_NOT_PROVIDED: To use getModule(), either the module should be decorated with store in decorator, i.e. @Module({store: store}) or store should be passed when calling getModule(), i.e. getModule(MyModule, this.$store)””

Using Vue 2.6.6 and vuex 3.1.0

Changing from: @Module({ namespaced: true, name: 'user', store })

To: @Module({ namespaced: true, store })

As @fdeitelhoff mentioned omitting name seems to fix the problem for me as well. I have a super basic namespaced user module in the root store. That was throwing this error when trying to dispatch an action.

I think something somewhere is a red herring here. I, too, had this problem, though it didn’t seem related to namespaces. I was going to file an issue about creating promises in actions causing errors, because whenever I created a promise, my actions failed with this same error.

Turns out adding ({rawError: true}) revealed exactly what my error was. It had nothing to do with promises.

So I think there needs to be better error-reporting in this particular failure case, since any errors are getting caught and reported with this generic message. I lost a few hours to this. 😃

Thanks.

Did anyone manage to solve this problem? As others in this thread, I get the error following error ERR_ACTION_ACCESS_UNDEFINED with rawError: false and ERR_STORE_NOT_PROVIDED with rawError: true if I try to call a namespaced action.

// In some component
connect() {
  this.$store.dispatch('Connection/testAction'); // Error
}

...

// In connection store
@Module({ namespaced: true, name: 'Connection'})
export default class Connection extends VuexModule {
  @Action({ rawError: true })
  testAction() {
    console.log('test action');
  }
}

If I use the getModule function before calling the action, the error does not occur.

connect() {
  const connection = getModule(Connection, this.$store);
  connection.testAction() // This works fine - Ouput: "test action"
  this.$store.dispatch('Connection/testAction'); // This also works fine! - Output: "test action
}

So this is an fix to the problem, but I wouldn’t say it’s an optimal solution. This really seems like a bug to me.

   //fails without { rawError: true }
    @Action({ rawError: true })
    async doSomething(){
        console.log('doing something...')
        return new Promise((resolve, reject) =>{
            // resolve('blaaaaaaaaaaaaaaaaaaaaaaaa')
            reject ('errrrrrrrrrrrrrrrrrrrrrrrrrrr')
        })
    }

if there is an reject in a Promise it always fail without rawError, I think this case should be in the read-me, is a common case.

I use getModule function, then call action successfully.

@douglasg14b You don’t return the promise in your FetchAll @Action. So vuex-module-decorators will only receive undefined. Did you check if this causes your issue?

@sfakir Have you tried taking the name property out of the Module annotation?

Removing the module name in the module declaration fixes it for me! Not quite sure if there will be other errors when the module name is missing. But for the moment everything seems to be okay!

@sfakir Have you tried taking the name property out of the Module annotation?

To avoid using getModule() before calling every action, you can export your Vuex module like this:

class MyModule extends VuexModule {
...
}
export default getModule(MyModule);

You might have to also use the param dynamic: true in your @Module decorator, I am not sure.