Vuex-module-decorators: Error when using vuex-module-decorators and @nuxtjs/auth together

[Hamidrezana]

I am using nuxtjs with typescript and use vuex-module-decorators. but I get error when add @nuxtjs/auth to my project.

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)

This error happen when call Action.

When @nuxtjs/auth from modules it's ok.

store/index.ts

import { Store } from "vuex";
import { initializeStores } from "~/utils/store-accessor";
const initializer = (store: Store<any>) => initializeStores(store);
export const plugins = [initializer];
export * from "~/utils/store-accessor";

utils/store-accessor

import { Store } from "vuex";
import { getModule } from "vuex-module-decorators";
import Login from "~/store/Login";
import App from "~/store/App";

let loginStore: Login, appStore: App;

function initializeStores(store: Store<any>): void {
    loginStore = getModule(Login, store);
    appStore = getModule(App, store);
}

export { initializeStores, loginStore, appStore };

[DenisNikonov]

You can try:

// nuxt.config.ts
auth: {
    vuex: false
}

[Hamidrezana]

@DenisNikonov This works but is lose accessing user info with $auth.

[AllanPinheiroDeLima]

There is no way on solving this issue ?

[AllanPinheiroDeLima]

Look, I'm not saying that this is pretty, but will solve the issue. Thing is, I don't know what is nuxt/authjs doing that causes this.
The workaround I've found to not disable vuex and still mantaining full functionality is to use dynamic stores.

So, you create the store within the declaration of the store's class and keep everything else as it is shown in docs example:

import Vuex from 'vuex'
import { Module, VuexModule, Mutation } from 'vuex-module-decorators'

interface RootState {}
const store = new Vuex.Store<RootState>({
  actions: {
    nuxtServerInit: () => {}
  }
});

@Module({
  stateFactory: true,
  name: "exams",
  dynamic: true,
  namespaced: true,
  store
})
export default class ExamsStore extends VuexModule {
  public _exam: any = null;
  private _activeTemplate: any = null;

  @Mutation
  setExam (exam: any) {
    this._exam = exam
  }

  @Mutation
  removeExam () {
    this._exam = null
  }

  get exam () {
    return this._exam;
  }

}