feat: move Next config to MJS and update Service Worker to Serwist

.gitignore

@@ -41,3 +41,7 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# generated Service Worker files
+public/sw*
+public/swe-worker*

next.config.mjs

@@ -0,0 +1,32 @@
+import createMDX from "@next/mdx"
+import createSerwist from "@serwist/next"
+import { createVanillaExtractPlugin } from "@vanilla-extract/next-plugin"
+import remarkPrism from "remark-prism"
+
+const withMDX = createMDX({
+  extension: /\.mdx?$/,
+  options: {
+    remarkPlugins: [remarkPrism],
+  },
+})
+
+const withSerwist = createSerwist({
+  swSrc: "src/app/sw.ts",
+  swDest: "public/sw.js",
+})
+
+const withVanillaExtract = createVanillaExtractPlugin()
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  images: {
+    unoptimized: true,
+  },
+  output: "export",
+  pageExtensions: ["js", "jsx", "mdx", "ts", "tsx"],
+  typescript: {
+    ignoreBuildErrors: true,
+  },
+}
+
+export default withVanillaExtract(withSerwist(withMDX(nextConfig)))

package.json

@@ -23,12 +23,12 @@
     "@mdx-js/loader": "3.1.0",
     "@mdx-js/react": "3.1.0",
     "@next/mdx": "15.1.3",
+    "@serwist/next": "^9.0.11",
     "@vanilla-extract/css": "^1.17.0",
     "@vanilla-extract/recipes": "^0.5.5",
     "clsx": "^2.1.1",
     "lodash": "^4.17.21",
     "next": "15.1.3",
-    "next-pwa": "^5.6.0",
     "prettier": "^3.4.2",
     "react": "19.0.0",
     "react-dom": "19.0.0",
@@ -40,6 +40,7 @@
     "@types/react": "19.0.2",
     "@vanilla-extract/next-plugin": "^2.4.8",
     "schema-dts": "^1.1.2",
+    "serwist": "^9.0.11",
     "typescript": "4.9.3"
   },
   "resolutions": {

src/app/sw.ts

@@ -0,0 +1,25 @@
+import { defaultCache } from "@serwist/next/worker"
+import type { PrecacheEntry, SerwistGlobalConfig } from "serwist"
+import { Serwist } from "serwist"
+
+// This declares the value of `injectionPoint` to TypeScript.
+// `injectionPoint` is the string that will be replaced by the
+// actual precache manifest. By default, this string is set to
+// `"self.__SW_MANIFEST"`.
+declare global {
+  interface WorkerGlobalScope extends SerwistGlobalConfig {
+    __SW_MANIFEST: (PrecacheEntry | string)[] | undefined
+  }
+}
+
+declare const self: ServiceWorkerGlobalScope
+
+const serwist = new Serwist({
+  precacheEntries: self.__SW_MANIFEST,
+  skipWaiting: true,
+  clientsClaim: true,
+  navigationPreload: true,
+  runtimeCaching: defaultCache,
+})
+
+serwist.addEventListeners()

tsconfig.json

@@ -5,7 +5,7 @@
       "#*": ["./src/*"]
     },
     "target": "es2015",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": ["dom", "dom.iterable", "esnext", "WebWorker"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": false,
@@ -18,6 +18,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
+    "types": ["@serwist/next/typings"],
     "plugins": [
       {
         "name": "next"
@@ -26,5 +27,5 @@
     "strictNullChecks": true
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
+  "exclude": ["node_modules", "public/sw.js"]
 }