chore(backporting): backported some changes from @serwist/next@8.0.0

Author: DuCanhGH

.changeset/clean-kangaroos-turn.md

@@ -0,0 +1,17 @@
+---
+"@ducanh2912/next-pwa": major
+---
+
+chore(backporting): backported some changes from `@serwist/next@8.0.0`
+
+- Removed `buildExcludes`.
+  - Simply use `workboxOptions.exclude` as a replacement.
+- Removed `customWorkerDir`.
+  - Use `customWorkerSrc` instead.
+- Removed `browserslist`, `swcMinify`, `watchWorkersInDev`.
+  - We now create child compilers on Next.js's compiler instead of starting separate Webpack processes.
+  - This also means you don't need to have `@swc/core` installed anymore.
+- Change the default value for `dest` from `".next"` to `"public"`.
+  - You should change it to `".next"` in your project if there's demand, but I'd recommend using `"public"` instead.
+- Fixed the custom worker and the fallback worker not working...
+  - I'm seriously sorry... This was caused by `next-pwa`'s `importScripts` not being passed to Workbox.

.prettierignore

@@ -54,4 +54,5 @@ coverage/
 LICENSE
 CODE_OF_CONDUCT.md
 
-tsconfig.json
+tsconfig.json
+docs/.contentlayer

docs/package.json

@@ -10,30 +10,30 @@
   },
   "dependencies": {
     "@ducanh2912/next-pwa": "workspace:*",
-    "@mantine/hooks": "7.2.2",
-    "@tabler/icons-react": "2.40.0",
+    "@mantine/hooks": "7.3.1",
+    "@tabler/icons-react": "2.43.0",
     "bright": "0.8.4",
     "client-only": "0.0.1",
     "contentlayer": "0.3.4",
     "highlight.js": "11.9.0",
-    "next": "14.0.3",
+    "next": "14.0.4",
     "next-contentlayer": "0.3.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-wrap-balancer": "1.1.0",
     "server-only": "0.0.1",
-    "tailwind-merge": "2.0.0",
+    "tailwind-merge": "2.1.0",
     "uuid": "9.0.1",
-    "zustand": "4.4.6"
+    "zustand": "4.4.7"
   },
   "devDependencies": {
     "@types/extend": "3.0.4",
     "@types/hast": "3.0.3",
     "@types/mdast": "4.0.3",
     "@types/mdx": "2.0.10",
-    "@types/node": "20.9.1",
-    "@types/react": "18.2.37",
-    "@types/react-dom": "18.2.15",
+    "@types/node": "20.10.4",
+    "@types/react": "18.2.43",
+    "@types/react-dom": "18.2.17",
     "@types/uuid": "9.0.7",
     "autoprefixer": "10.4.16",
     "extend": "3.0.2",
@@ -45,11 +45,11 @@
     "mdast-util-to-markdown": "2.1.0",
     "mdast-util-to-string": "4.0.0",
     "mdx-bundler": "10.0.1",
-    "postcss": "8.4.31",
+    "postcss": "8.4.32",
     "rehype-highlight": "7.0.0",
     "rehype-sanitize": "6.0.0",
-    "tailwindcss": "3.3.5",
-    "typescript": "5.4.0-dev.20231118",
+    "tailwindcss": "3.3.6",
+    "typescript": "5.4.0-dev.20231210",
     "unified": "10.1.2",
     "unist-util-is": "6.0.0",
     "unist-util-visit": "5.0.0"

docs/src/app/(home)/code-showcase.mdx

@@ -52,14 +52,13 @@ const withPWA = require("@ducanh2912/next-pwa").default({
   // register: true,
   // scope: "/app",
   // sw: "service-worker.js",
-  // customWorkerDir: "service-worker",
+  // customWorkerDest: "service-worker",
   // cacheStartUrl: true,
   // dynamicStartUrl: true,
   // dynamicStartUrlRedirect: "/foo/bar",
   // cacheOnFrontendNav: true,
   // aggressiveFrontEndNavCaching: true,
   // scope: "/beta",
-  // swcMinify: true,
   // workboxOptions: {},
   // ...
 });

docs/src/app/icon.tsx

@@ -13,6 +13,8 @@ export const size = {
   height: 32,
 };
 
+export const generateStaticParams = () => [];
+
 const Icon = async () => {
   const notoSansMono = await fs.readFile(
     path.join(__dirname, "../shared/notoSansMono.ttf")

docs/src/app/~offline/ReloadButton.tsx

@@ -0,0 +1,13 @@
+"use client";
+import { Heading } from "@/components/Heading";
+
+export const ReloadButton = () => {
+  return (
+    <button
+      onClick={() => window.location.reload()}
+      className="ml-2 [&>span]:!my-0"
+    >
+      <Heading type="subtitle">Try reloading?</Heading>
+    </button>
+  );
+};

docs/src/app/~offline/page.tsx

@@ -0,0 +1,14 @@
+import { Heading } from "@/components/Heading.js";
+
+import { ReloadButton } from "./ReloadButton.js";
+
+const Page = () => {
+  return (
+    <div className="flex w-full items-center justify-center self-stretch">
+      <Heading type="title-large">offline. </Heading>
+      <ReloadButton />
+    </div>
+  );
+};
+
+export default Page;

examples/basic/package.json

@@ -11,14 +11,14 @@
   },
   "dependencies": {
     "@ducanh2912/next-pwa": "latest",
-    "next": "14.0.3",
+    "next": "14.0.4",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@types/node": "20.9.1",
-    "@types/react": "18.2.37",
-    "@types/react-dom": "18.2.15",
-    "typescript": "5.2.2"
+    "@types/node": "20.10.4",
+    "@types/react": "18.2.43",
+    "@types/react-dom": "18.2.17",
+    "typescript": "5.3.3"
   }
 }

examples/custom-server/next.config.js

@@ -5,7 +5,6 @@ const withPWA = require("@ducanh2912/next-pwa").default({
 /** @type {import("next").NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  swcMinify: true,
 };
 
 module.exports = withPWA(nextConfig);

examples/custom-server/package.json

@@ -14,18 +14,18 @@
     "@fastify/compress": "6.5.0",
     "cross-env": "7.0.3",
     "fastify": "4.24.3",
-    "next": "14.0.3",
+    "next": "14.0.4",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@swc/core": "1.3.96",
-    "@types/node": "20.9.1",
-    "@types/react": "18.2.37",
-    "@types/react-dom": "18.2.15",
-    "nodemon": "3.0.1",
+    "@swc/core": "1.3.100",
+    "@types/node": "20.10.4",
+    "@types/react": "18.2.43",
+    "@types/react-dom": "18.2.17",
+    "nodemon": "3.0.2",
     "rimraf": "5.0.5",
-    "ts-node": "10.9.1",
-    "typescript": "5.2.2"
+    "ts-node": "10.9.2",
+    "typescript": "5.3.3"
   }
 }