Incremental Static Regeneration in Nuxt
I've been waiting a long time for this feature. Here's what they say:
Various examples of setting route rules:
export default defineNuxtConfig({ routeRules: { // all routes (by default) will be revalidated every 60 seconds, in the background '/**': { isr: 60 }, // this page will be generated on demand and then cached permanently '/static': { isr: true }, // this page is generated at build time and cached permanently '/prerendered': { prerender: true }, // this page will be always fresh '/dynamic': { isr: false }, // you can do lots more with route rules too! '/redirect': { redirect: '/static' }, '/headers': { headers: { 'x-magic-of': 'nuxt and vercel' } }, '/spa': { ssr: false }, }, })
Now, the interesting part:
https://nitro.unjs.io/deploy/providers/vercel#on-demand-incremental-static-regeneration-isr
First you need a bypass token set in your app:
nitro.config.ts export default defineNitroConfig({ vercel: { config: { bypassToken: process.env.VERCEL_BYPASS_TOKEN } } }) # OR // nuxt.config.ts export default defineNuxtConfig({ nitro: { vercel: { config: { bypassToken: process.env.VERCEL_BYPASS_TOKEN } } } })
Finally:
To trigger "On-Demand Incremental Static Regeneration (ISR)" and revalidate a path to a Prerender Function, make a GET or HEAD request to that path with a header of x-prerender-revalidate: . When that Prerender Function endpoint is accessed with this header set, the cache will be revalidated. The next request to that function should return a fresh response.
Frankly it's bizarre that this feature took so long to be implemented, it's by far the most important feature of all. Its absence is why I left Nuxt for next.js. But, it's here now.