Search code examples
vue.jsnuxt.jsqr-code

vue nuxt qrcode reader installation

I'm having a Nuxt.js project where I try to use the qrcode-scanner library I fallow the steps to register globaly.

I made a js file in plugins folder and add the fallowing code

import Vue from "vue";
import VueQrcodeReader from "vue-qrcode-reader";

Vue.use(VueQrcodeReader);

It looks pretty straight forward, but my app crashes and never loads. Anyone experienced this problem ?

Solution

  • i test your code and it works for me by the way i explain my steps for you, maybe you forget one step:

    1. install package with npm install vue-qrcode-reader
    2. make file named qr.js in my plugin folder
    3. then put this code on it:
    import Vue from 'vue'
import VueQrcodeReader from 'vue-qrcode-reader'

Vue.use(VueQrcodeReader)
    1. add plugin to my nuxt.config.js file :
      plugins: ['~/plugins/qr']

    NOTE:qr is the name of my file(qr.js)

    1. use the plugin in my vue page with adding following code in it's place:
    <qrcode-stream></qrcode-stream>
<qrcode-drop-zone></qrcode-drop-zone>
<qrcode-capture></qrcode-capture>