title: Nuxt.js with vuex-persist - persisted state not available in asyncData upon page refresh
body: <p>Upon first page refresh, the asyncData function is not able to fetch the persisted state. When I follow another NuxtLink, and go back to this page, while the state is not mutated in the meantime, the data is there. This means the persisted state is not available on the server side at first load/refresh. LocalStorage is where I choose to persist the relevant state items.</p>
  
  <p>A pages component that uses asyncData:</p>
  
  <pre><code>  asyncData({ app, params, store }) {
    //its not available upon first refresh, but is after following a random nuxtlink and going back
      const cartProducts = store.getters.getCartProducts 
  },
  </code></pre>
  
  <p>store/index.js is straightforward. Unfortunately, the state is completely empty in asyncData upon first page refresh.</p>
  
  <pre><code>  getCartProducts(state) {
      return state.cart.products
    },
  </code></pre>
  
  <p>vuex-persist.js imported properly with mode 'client' as recommended in the Github Readme</p>
  
  <pre><code>import VuexPersistence from 'vuex-persist'
  /** https://github.com/championswimmer/vuex-persist#tips-for-nuxt */
  
  export default ({ store }) =&gt; {
    window.onNuxtReady(() =&gt; {
      new VuexPersistence({
        key: 'cartStorage'
        /* your options */
      }).plugin(store)
    })
  }
  </code></pre>
  
  <p>How can I make sure the relevant store terms from local storage are persisted <strong>before</strong> asyncData is called?</p>