title: load vue-native-websocket in quasar
body: <p>Im trying to load vue-native-websockets in <a href="https://www.npmjs.com/package/vue-native-websocket-vue3" rel="nofollow noreferrer">quasar</a> but Im kind of lost.</p>
  <p>I tried to run this as a boot file in quasar:</p>
  <pre><code>import VueNativeSock from 'vue-native-websocket'
  
  export default async ({ app, router, store, Vue }) =&gt; {
     Vue.use(VueNativeSock, 'ws://127.0.0.1:5679', { 
       store: store,
       //format: 'json',
       reconnection: true,
       reconnectionAttempts: 5,
       reconnectionDelay: 3000
     })
  }
  </code></pre>
  <p>and then:</p>
  <pre><code>this.$socket.send(&quot;my value&quot;);
  </code></pre>
  <p>in a function in my component but I guess I missunderstand the concept. Im pretty new to quasar so a working example would be great indeed ...</p>
  <p>I can run this by just creating a connection locally in the component I want to use by putting this in the create method:</p>
  <pre><code>this.connection = new WebSocket(&quot;ws://127.0.0.1:5679/&quot;);
  </code></pre>
  <p>and then using that in a method like:</p>
  <pre><code>this.connection.send(&quot;myValue&quot;)
  </code></pre>
  <p>but the goal is to be able to use the connection in whatever component I like without creating it locally in the create function in that component ...</p>
  <p>How can I achieve this?</p>
  <p><strong>UPDATE</strong></p>
  <p>when using:
  <a href="https://www.npmjs.com/package/vue-native-websocket-vue3" rel="nofollow noreferrer">https://www.npmjs.com/package/vue-native-websocket-vue3</a></p>
  <p>I get this errormessage after implementing it in main.js</p>
  <pre><code>import Vue from 'vue'
  import VueRouter from 'vue-router'
  
  import routes from './routes'
  
  Vue.use(VueRouter)
  import  VueNativeSock  from  &quot;vue-native-websocket-vue3&quot; ;
  
  Vue.use( VueNativeSock , 'ws://127.0.0.1:5679' );
  </code></pre>
  <p>Errormessage:</p>
  <blockquote>
  <p>property '$socket' of undefined
  at Object.install (vueNativeWebsocket.common.js?9cca:3701)
  at Function.Vue.use (vue.runtime.esm.js?5593:5107)
  at eval (index.js?a18c:10)
  at Module../src/router/index.js (app.js:1147)   <a href="https://www.npmjs.com/package/vue-native-websocket-vue3" rel="nofollow noreferrer">1</a>: <a href="https://quasar.dev/" rel="nofollow noreferrer">https://quasar.dev/</a></p>
  </blockquote>