fix: provide payload fallback json

Author: danielroe

modules/isr-fallback.ts

@@ -13,6 +13,8 @@ export default defineNuxtModule({
     }
 
     nuxt.hook('nitro:init', nitro => {
+      const htmlFallback = 'spa.prerender-fallback.html'
+      const jsonFallback = 'payload-fallback.json'
       nitro.hooks.hook('compiled', () => {
         const spaTemplate = readFileSync(nitro.options.output.publicDir + '/200.html', 'utf-8')
         for (const path of [
@@ -26,14 +28,10 @@ export default defineNuxtModule({
           'package/[org]/[name]/v/[version]',
           '',
         ]) {
-          const outputPath = resolve(
-            nitro.options.output.serverDir,
-            '..',
-            path,
-            'spa.prerender-fallback.html',
-          )
+          const outputPath = resolve(nitro.options.output.serverDir, '..', path, htmlFallback)
           mkdirSync(resolve(nitro.options.output.serverDir, '..', path), { recursive: true })
           writeFileSync(outputPath, spaTemplate)
+          writeFileSync(outputPath.replace(htmlFallback, jsonFallback), '{}')
         }
       })
     })

nuxt.config.ts

@@ -95,10 +95,14 @@ export default defineNuxtConfig({
       },
     },
     // pages
-    '/package/:name': { isr: getISRConfig(60, true) },
-    '/package/:name/v/:version': { isr: getISRConfig(60, true) },
-    '/package/:org/:name': { isr: getISRConfig(60, true) },
-    '/package/:org/:name/v/:version': { isr: getISRConfig(60, true) },
+    '/package/:name': { isr: getISRConfig(60, { fallback: 'html' }) },
+    '/package/:name/_payload.json': { isr: getISRConfig(60, { fallback: 'json' }) },
+    '/package/:name/v/:version': { isr: getISRConfig(60, { fallback: 'html' }) },
+    '/package/:name/v/:version/_payload.json': { isr: getISRConfig(60, { fallback: 'json' }) },
+    '/package/:org/:name': { isr: getISRConfig(60, { fallback: 'html' }) },
+    '/package/:org/:name/_payload.json': { isr: getISRConfig(60, { fallback: 'json' }) },
+    '/package/:org/:name/v/:version': { isr: getISRConfig(60, { fallback: 'html' }) },
+    '/package/:org/:name/v/:version/_payload.json': { isr: getISRConfig(60, { fallback: 'json' }) },
     // infinite cache (versioned - doesn't change)
     '/package-code/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
     '/package-docs/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
@@ -281,11 +285,15 @@ export default defineNuxtConfig({
   },
 })
 
-function getISRConfig(expirationSeconds: number, fallback = false) {
-  if (fallback) {
+interface ISRConfigOptions {
+  fallback?: 'html' | 'json'
+}
+function getISRConfig(expirationSeconds: number, options: ISRConfigOptions = {}) {
+  if (options.fallback) {
     return {
       expiration: expirationSeconds,
-      fallback: 'spa.prerender-fallback.html',
+      fallback:
+        options.fallback === 'html' ? 'spa.prerender-fallback.html' : 'payload-fallback.json',
     } as { expiration: number }
   }
   return {