vue-native-websocket : Vue.js + Typescript 사용 방법

타입스크립트가 적용된 vuejs에서 vue-native-websocket 사용하려면 파일 1개 생성, 파일 1개 수정이 필요합니다. 매우 간단하니 아래 코드를 복사해서 붙여넣기하셔도 됩니다.


파일 생성

파일 이름 : vue-native-websocket.d.ts


declare module 'vue-native-websocket' {
import Vue, { PluginFunction } from 'vue';

export const installPluginFunction<{}>;
module 'vue/types/vue' {
  interface Vue {
    $socketany;
  }
}

module 'vue/types/options' {
  interface ComponentOptions<V extends Vue> {
    sockets?any;
  }
}


타입스크립에서 vue-native-websocket 사용할 수 있게 d.ts 파일 추가가 필요한데, 위와 같이 꾸며주시면 됩니다.


파일 수정

파일 이름 : main.ts


import VueNativeSock from 'vue-native-websocket';

Vue.use(VueNativeSockconnectUrl, {
 mutationssocket,
 passToStoreHandlerhandlerReceive,
});


vue-native-websocket를 사용할 수 있도록 main.ts 파일에 vue-native-websocket를 명시적으로 선언해야 하는데요. Vue.use 안에는 몇 가지 옵션을 추가할 수 있습니다. 해당 옵션은 필요한 것 검색해 추가하시면 됩니다.



댓글(0)

Designed by JB FACTORY