'vue-cookies-reactive with Nuxt.js

Trying to set up vue-cookies-reactive with Nuxt.js - I can set cookies from the plugin file but not in components.

vue-cookies-reactive.js:

import Vue from 'vue'
import VueCookies from 'vue-cookies-reactive'
Vue.use(VueCookies)

// set global cookie
Vue.$cookies.set('test','123'); // THIS WORKS

nuxt.config.js:

  plugins: [
   { src: '~/plugins/vue-cookies-reactive.js', mode: 'client'}
  ],

ANY component:

console.log('cooks', this.$cookies); // this logs the same methods as the vue-cookies-reactive docs, yay!

this.$cookies.set('abc', '567'); // this however, crashes my app. error: Cannot set property 'cookies' of null

(cooks log:

cooks {
  reactive: null,
  install: [Function: install],
  config: [Function: config],
  get: [Function: get],
  set: [Function: set],
  remove: [Function: remove],
  isKey: [Function: isKey],
  keys: [Function: keys],
  refresh: [Function: refresh]
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source