Vue.js प्लगइन त्रुटि: अपरिभाषित

मैं GodofBrowser से एक प्लगइन का उपयोग करने का प्रयास कर रहा हूं, जैसा कि कहा गया है, लेकिन मुझे एक त्रुटि मिल रही है

  this.$dialog.confirm('Please confirm to continue')
  Uncaught TypeError: Cannot read property 'confirm' of undefined

तो यह।$प्लगइन अपरिभाषित है .... क्यों ?

// I installed it via npm 
npm install vuejs-dialog

main.js

// I imported it
import Vue from "vue"
import VuejsDialog from "vuejs-dialog"

// and I told Vue to install it 
Vue.use(VuejsDialog)

फिर मैं इसे 'क्लिक' विधि पर अपने App.vue में उपयोग करने का प्रयास कर रहा हूं:

App.vue

    <template>
      <div id="app" class="container">
        <ul class="navigation">
          <li id="home"><router-link :to="{ name: 'Home' }" >Home</router-link></li>
          <li id="shoppinglists" v-if="!logged">
            <span @click.capture="clicked">
              <router-link :to="{ name: 'ShoppingLists' }" >Shopping Lists</router-link>
            </span>
          </li>
          <li v-else id="shoppinglists"><router-link :to="{ name: 'ShoppingLists', params: { id: currentUserId } }" >Shopping Lists</router-link></li>
        </ul>
        <router-view></router-view>
      </div>
    </template>

    <script>
    import store from '@/vuex/store'
    import { mapGetters } from 'vuex'

    export default {
      name: 'app',
      methods: {
        clicked: (event) => {
          event.preventDefault()
          console.log('clicked!'). // got it in console
          this.$dialog.confirm('Please confirm to continue') // !ERROR
          .then(function () {
            console.log('Clicked on proceed')
          })
          .catch(function () {
            console.log('Clicked on cancel')
          })
        }
      },
      computed: {
        ...mapGetters({ currentUserId: 'getCurrentUserId', logged: 'getLogged' })
      },
      store
    }
    </script>