NuxtServerInit caching mechanism

axios.js plugin

import { cacheAdapterEnhancer } from 'axios-extensions'
import LRUCache from 'lru-cache'
const ONE_HOUR = 1000 * 60 * 60

const defaultCache = new LRUCache({ maxAge: ONE_HOUR })

export default function ({ $axios }) {
  const defaults = $axios.defaults
  // https://github.com/kuitos/axios-extensions
  defaults.adapter = cacheAdapterEnhancer(defaults.adapter, {
    enabledByDefault: false,
    cacheFlag: 'useCache',
    defaultCache
  })
}

nuxt.config.js

const Config = require('./assets/config')
const axios = require('axios')

module.exports = {
  ... // other config
  /*
  ** Generate dynamic pages configuration
  */
  generate: {
    routes: function () {
      return axios.get(`${Config.wpDomain}${Config.api.projects}`).then(res => {
        return res.data.map(project => {
          return { route: '/' + project.slug, payload: project }
        })
      })
    }
  },
  plugins: [
    '~/plugins/axios.js',
    // ...other plugins here
  ]
  ... // other config
}

store.js

import Vuex from 'vuex'
import Config from '~/assets/config.js'

const createStore = () => {
  return new Vuex.Store({
    state: {
      homePage: []
    },
    mutations: {
      setHomepage (state, obj) {
        state.homePage = obj
      }
    },
    actions: {
      async nuxtServerInit ({ commit }, { app, route }) {
        console.log('============= Server Init API calls =============')
        try {
          console.log('home')
          const home = await app.$axios.get(
            Config.wpDomain + Config.api.homePage,
            { useCache: true }
          )
          commit('setHomepage', home.data)
        } catch (e) {
          console.log('error with API', e)
        }
      }
    }
  })
}

export default createStore