Vue session storage plugin and vue router | vue add session
yourproblemisthatyouarecallingVue.use(VueSessionStorage)afteryouimporttherouter,whichmeansthislineinrouter.jswon’twork:constsession=Vue.prototype.$session;atthemomentthatthislineruns,thesessionspluginhasn’tbeeninstalledyet,andtherefore,thatpropertyisundefined.Agoodsolutionwouldbetoactuallyloadthispluginfromitsownfile,whereyoucandotheimportandVue.use()inonego,andthenimportthisfilebeforetherouter.///src/session.jsimportVueSessionStoragefromvue-sessionstorageVue.use(VueSessionStorage)//src/main...
your problem is that you are calling Vue.use(VueSessionStorage) after you import the router, which means this line in router.js won’t work:
const session = Vue.prototype.$session;at the moment that this line runs, the sessions plugin hasn’t been installed yet, and therefore, that property is undefined.
A good solution would be to actually load this plugin from its own file, where you can do the import and Vue.use() in one go, and then import this file before the router.
// /src/session.js import VueSessionStorage from vue-sessionstorage Vue.use(VueSessionStorage) // src/main.js import ./session import router from ./routerAlternatively you could read the property in router.js from within the methods where you use it - when these methods run, the plugin will be installed either way:
router.beforeEach((to, from, next) => { if (Vue-prototype.$session.exists(‘user’)) { console.log(‘test session storage’); }