programing

vuex-module-decorator와 @nuxtjs/auth를 함께 사용할 때 오류 발생

goodsources 2022. 8. 8. 20:06
반응형

vuex-module-decorator와 @nuxtjs/auth를 함께 사용할 때 오류 발생

nuxtjs를 typescript와 함께 사용하고 vuex-module-decorator를 사용하지만 추가 시 오류가 발생합니다.@nuxtjs/auth할 수 있습니다.

Uncaughed(약속되지 않음) 오류: ERR_STORE_NOT_PROVIDED: getModule()을 사용하려면 모듈을 데코레이터(@Module({store:store})에 저장하거나 getModule()을 호출할 때 저장해야 합니다.$store)

이 오류는 Action을 호출할 때 발생합니다.

언제@nuxtjs/auth모듈에서는 괜찮습니다.

스토어/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

/* eslint-disable import/no-mutable-exports */
import { Store } from "vuex";
import { getModule } from "vuex-module-decorators";
import { NuxtAxiosInstance } from "@nuxtjs/axios";
import Login from "~/store/Login";
import App from "~/store/App";

let $axios: NuxtAxiosInstance;

function initializeAxios(axiosInstance: NuxtAxiosInstance) {
    $axios = axiosInstance;
}

let loginStore: Login, appStore: App;

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

export { initializeStores, initializeAxios, loginStore, appStore, $axios };

덧붙이다 vuex: false로.authnuxt.config.jsadd errors는 사라졌지만, 지금은 에 액세스할 수 없습니다.$auth.user컴포넌트 내.그래서 제가 직접 하고 vuex에 사용자 스토어를 만들고 사용자 정보를 수동으로 가져옵니다.

다음과 같이 plugin/auth.js를 추가합니다.

import { initialiseStores } from "~/utils/store-accessor";

export default function ({ $auth, store }) {
  initialiseStores(store); 

  $auth.onError((error, name, endpoint) => {
    console.log(name, error, endpoint);
  });

  $auth.onRedirect((to, from) => {
    // you can optionally change `to` by returning a new value
  });
}

그런 다음 다음과 같이 구성 요소에서 작업을 실행할 수 있습니다.

import moduleName from "@/store"

...

methods: {
  m() {
    moduleName.someAction()
  }
}

언급URL : https://stackoverflow.com/questions/62923455/error-when-using-vuex-module-decorators-and-nuxtjs-auth-together

반응형