title: How do I get Vue-Cookies to work in Vue-Router Component
body: <p>I have a router index.js file that loads Vue, Vue-Router and Vue-Cookies like so:</p>
  
  <pre><code>import Vue from 'vue';
  import Router from 'vue-router';
  import VueCookies from 'vue-cookies';
  
  Vue.use(Router);
  Vue.use(VueCookies);
  </code></pre>
  
  <p>I then define all of my routes like this:</p>
  
  <pre><code>const router = new Router({
    routes: [
      {
        path: '*',
        name: 'erorr',
        secure: false,
        component: error404,
      },
      {
        path: '/',
        name: 'Home',
        secure: false,
        component: home,
      },
      {
        path: '/clp',
        name: 'CLP',
        secure: true,
        component: clpHome,
      },
      {
        path: '/saml/login',
        name: 'samlLogin',
        secure: false,
        component: samlLogin,
      },
      {
        path: '/saml/logout',
        name: 'samlLogout',
        secure: false,
        component: samlLogout,
      },
      {
        path: '/user/profile',
        name: 'userProfile',
        secure: false,
        component: userProfile,
      },
    ],
  });
  </code></pre>
  
  <p>After this, it is checking to see if a cookie is set:</p>
  
  <pre><code>router.beforeEach((to, from, next) =&gt; {
    // Look at all routes
    router.options.routes.forEach((route) =&gt; {
      // If this is the current route and it's secure
      if (((to.matched[0].path === route.path || to.matched[0].path === '')/* &amp;&amp; route.path === '/'*/) &amp;&amp; route.secure) {
        // Check if there's a cookie and verify it
        // Check if user has cookie "SAMLSession"
  </code></pre>
  
  <p>This is where the error pops up, "TypeError: Cannot read property 'isKey' of undefined" When I attempt to 
      console.log(this.$cookies);
  it is returned 'undefined' as well.</p>
  
  <pre><code>      if (this.$cookies.isKey('SAMLSession')) {
          // Sets the value of "SAMLSession" cookie to a variable
          const sessionId = this.$cookies.get('SAMLSession');
          // Runs function checkSaml located above, then once that completes....
          checkSaml(sessionId).then(result =&gt; {
            // Check if the session id is valid via Express, noted by a response of "OK" if good, and "BAD!" if not valid
            if (result.data === 'OK') {
              // If it's good, allow the user to see the page
              next();
            } else {
              // If it's not valid, set a cookie of the page the user was trying to access and then sign them in
              this.$cookies.set('referLocation', to.path, Infinity, '/');
              next('/saml/login');
            }
          });
        } else {
          // If it's not a cookie, set a cookie of the page the user was trying to access and then sign them in
          this.$cookies.set('referLocation', to.path, Infinity, '/');
          next('/saml/login');
        }
      }
    });
    // If nothing has happened, allow the user to visit the page
    next();
  });
  </code></pre>
  
  <p>This configuration was working a few days ago, and now it is not loading VueCookies, Any advice in troubleshooting it would be appreciated.</p>