Can't use plugins in vue

Question

I want to manage cookies in the browser and use this external plugin vue-cookies. But if I call its method in some vue file as this.$cookies.get(...) I get an error in the browser: TypeError: Cannot set property '$cookies' of undefined

Here is my code. Main.js

    import App from './App.vue'
    import router from './router'
    import VueCookies from 'vue-cookies';
    import { createApp } from 'vue'
    const app = createApp(VueCookies)
    app.use(VueCookies);
    createApp(App).use(router).mount('#app')

App.vue (or any other.vue file)

beforeMount() {

    var cookie = "";
    cookie = this.$cookies.get("testname");
    console.log(cookie);
}

Answer 1

As of v1.7.4, vue-cookies only works with Vue 2.

Vue 3 requires vue3-cookies instead:

import Vue from 'vue'
import VueCookies from 'vue3-cookies'

createApp(App)
  .use(VueCookies)
  .mount('#app')