fix: resolve pwa chunk loading error and use bun

firebase.json

@@ -12,9 +12,9 @@
       "firebase-debug.*.log"
     ],
     "predeploy": [
-      "pnpm --prefix \"$PROJECT_DIR\" install",
+      "bun install",
       "rm -r build",
-      "pnpm --prefix \"$PROJECT_DIR\" run build"
+      "bun run build"
     ],
     "runtime": "nodejs20"
   },
@@ -34,6 +34,26 @@
         "source": "**",
         "function": "nextjsfunc"
       }
+    ],
+    "headers": [
+      {
+        "source": "/sw.js",
+        "headers": [
+          {
+            "key": "Cache-Control",
+            "value": "no-cache, no-store, must-revalidate"
+          }
+        ]
+      },
+      {
+        "source": "/workbox-*.js",
+        "headers": [
+          {
+            "key": "Cache-Control",
+            "value": "public, max-age=0, must-revalidate"
+          }
+        ]
+      }
     ]
   },
   "emulators": {

src/app/sw.ts

@@ -1,6 +1,6 @@
 import { defaultCache } from "@serwist/next/worker";
 import type { PrecacheEntry, SerwistGlobalConfig } from "serwist";
-import { Serwist } from "serwist";
+import { Serwist, NetworkFirst, ExpirationPlugin } from "serwist";
 
 // This declares the value of `injectionPoint` to typescript.
 // `injectionPoint` is the string that will be replaced by the actual precache list.
@@ -18,7 +18,21 @@ const serwist = new Serwist({
   skipWaiting: true,
   clientsClaim: true,
   navigationPreload: true,
-  runtimeCaching: defaultCache,
+  runtimeCaching: [
+    {
+      matcher: ({ request }: { request: Request }) => request.mode === "navigate",
+      handler: new NetworkFirst({
+        cacheName: "documents",
+        plugins: [
+          new ExpirationPlugin({
+            maxEntries: 50,
+            maxAgeSeconds: 60 * 60 * 24 * 30, // 30 Days
+          }),
+        ],
+      }),
+    },
+    ...defaultCache,
+  ],
 });
 
 serwist.addEventListeners();