Possible conflict with @nuxt/auth and/or axios

vuex-persistedstate version:
node version: v16.1.0
npm version: 7.11.2

It seems there's a compatibility issue with @nuxt/auth-next (and its previous version @nuxt/auth) or maybe with Axios.

When saving a string, an array and an object when clicking a button set on the homepage, these data are properly saved to the store and made persistent at page reload. But data retrieved with Axios and then saved to Vuex store are not made persistent (although they have beed added to the paths in plugins/persistedState.js).

I'm using Nuxt in universal mode and my configuration is the following.

plugins/persistedState.js:

import createPersistedState from 'vuex-persistedstate'
import * as Cookies from 'js-cookie'
import cookie from 'cookie'

export default ({ store, req }) => {
  createPersistedState({
    // paths: ['darkMode'],
    paths: ['myString', 'myArr', 'myObj', 'myDataRetrievedWithAxios'],
    storage: {
      getItem: (key) => {
        // See https://nuxtjs.org/guide/plugins/#using-process-flags
        if (process.server) {
          const parsedCookies = cookie.parse(req.headers.cookie || '')
          return parsedCookies[key]
        } else {
          return Cookies.get(key)
        }
      },
      // Please see https://github.com/js-cookie/js-cookie#json, on how to handle JSON.
      setItem: (key, value) =>
        Cookies.set(key, value, { expires: 365, secure: false }),
      removeItem: (key) => Cookies.remove(key),
    },
  })(store)
}

nuxt.config.js:

import colors from 'vuetify/es5/util/colors'
import webpack from 'webpack'

export default {
  ...
  /*
   ** Plugins to load before mounting the App
   */
  plugins: [
    { src: '~/plugins/helpers' },
    // { src: '~/plugins/vuex-persist', ssr: false },
    { src: '~/plugins/persistedState.js' },
  ],
...
  /*
   ** Axios module configuration
   ** See https://axios.nuxtjs.org/options
   */
  axios: {},
  /*
   ** Auth module configuration
   ** See https://auth.nuxtjs.org
   */
  auth: {
    redirect: {
      login: '/',
      logout: '/',
      callback: '/auth/callback',
      home: '/home',
    },
    strategies: {
      laravelPassport: {
        provider: 'laravel/passport',
        endpoints: {
          user: {
            url: '/foo/user',
          },
          login: {
            baseURL: '',
          },
          refresh: {
            baseURL: '',
          },
        },
        url: process.env.API_URL,
        clientId: process.env.CLIENT_ID,
        clientSecret: process.env.CLIENT_SECRET,
        grantType: 'password',
        autoLogout: true,
      },
    },
  },
  ...
}

robinvdvleuten / vuex-persistedstate

Possible conflict with @nuxt/auth and/or axios #411