programing

Nuxt 및 Vue-Native-Websocket에서의 Vuex 사용

sourcetip 2022. 8. 8. 23:13
반응형

Nuxt 및 Vue-Native-Websocket에서의 Vuex 사용

웹 소켓의 데이터로 vuex 스토어를 채우려고 합니다.저는 Nuxt를 쓰고 있어요.웹소켓 취급에는 vue-native-websocket 패키지를 사용합니다.웹 소켓 접속은 성공했지만 스토어에 커밋이 되지 않아 모든 소켓이벤트에서 오류가 발생합니다.Uncaught TypeError: this.store[n] is not a function

Nuxt 및 vue-native-websocket 문서에 따르면 다음과 같이 사용하고 있습니다.

플러그인 네이티브 websocket.js:

import Vue from 'vue'
import VueNativeSock from 'vue-native-websocket'
import store from '~/store'

Vue.use(VueNativeSock, 'wss://dev.example.com/websocket/ws/connect', { store: store })

nuxt.config.config.syslog

  plugins: [
   {src: '~plugins/native-websocket.js', ssr: false}
],

연결이 확립되어 있기 때문에 패키지는 올바르게 연결되어 있기 때문에 스토어에 관한 것이므로 무엇이 잘못되었는지 알 수 없습니다.

UPD: 몇 가지 회피책을 실행한 결과 native-websocket.js 내의 로깅스토어가 반환되는 것을 알 수 있었습니다.

store() {
  return new __WEBPACK_IMPORTED_MODULE_1_vuex__["default"].Store({
   state: {...my store

그리고 그것을 약속하면 돌아온다.__WEBPACK_IMPORTED_MODULE_2__store__.default.commit is not a function즉, 웹 팩에 관한 것입니다.

플러그인의 컨텍스트에서 가져오는 등 스토어를 다르게 Import해야 합니다.여기 몇 가지 문서가 있습니다만, 좀 부족한 점이 있습니다.

import Vue from 'vue'
import VueNativeSock from 'vue-native-websocket'

export default ({ store }, inject) => {
  Vue.use(VueNativeSock, 'wss://dev.example.com/websocket/ws/connect', { store: store })
}

언급URL : https://stackoverflow.com/questions/51523175/using-vuex-with-nuxt-and-vue-native-websocket

반응형