Setup

Learn how to setup cache module in your Nuxt 3 application.

Check out the Nuxt 3 documentation for more information about installing and using modules.

Installation

Add @nuxt-modules/cache dependency to your project:

yarn add @nuxt-modules/cache
npm install @nuxt-modules/cache

Then, add @nuxt-modules/cache to the buildModules section of your Nuxt configuration:

nuxt.config.js|ts
export default {
  buildModules: [
    ['@nuxt-modules/cache', {
      // Options
    }]
  ],
  // Or
  cache: {
    // Options
  }
}

Options

Defaults:

{
  browser: {
    pages: [
      // Your pages and cache headers
    ]
  },
  server: {
    // Comming soon!
  }
}

browser

This configuration object accepts all your configuration related to client side of the application. For now, there is only a support for pages but in the future we are planning to release more options. pages is an array of pages you want to apply the cache to. Each element of this array is an array as well, where:

  • first element is always a page path (i.e. /product),
  • and the second element is always a headers object you want to apply to the certain path (i.e. { 'max-age': 60, 'stale-when-revalidate': 5 })

You can read more about it here

server

This is not supported yet but we are planning to release soon a server cache support with Redis, Memcached, etc for full SSR cache.