The web app is now installable on a phone home screen with offline fallback for static assets and the navigation shell. Pieces ------ - `src/app/manifest.webmanifest/route.ts` — dynamic manifest route. Standalone display mode, portrait orientation, dark theme matching the app, "any maskable" icons so the same PNG works for both regular launchers and Android adaptive icons. - `src/pwa/sw.ts` — service worker entry. Uses serwist's stock recipe: skipWaiting + clientsClaim so a new worker takes over on the next navigation, navigationPreload to race the network with the worker boot, and `defaultCache` for HTML-network-first / static-cache-first / image+font cache TTLs. - `next.config.ts` — wraps the existing config with `withSerwistInit`. Disabled in development (`NODE_ENV !== "production"`) because a service worker on every dev reload makes hot-reload extremely flaky. - `package.json` build script switched to `next build --webpack`. `@serwist/next` doesn't yet support Turbopack (it logs a warning and silently skips emitting `sw.js`), and Next 16 defaults the build to Turbopack. The dev server still uses Turbopack — only production builds switch to webpack. - `src/app/layout.tsx` metadata gains `manifest`, `icons.icon` (192 + 512 PNG), and `icons.apple` (180 PNG). The existing `appleWebApp.capable` already opts iOS into standalone mode. Icons ----- Generated by a tiny one-shot script (`scripts/gen-pwa-icons.ts`) that uses the workspace's already-installed sharp to render an SVG wordmark at 512 / 192 / 180 px. Placeholder branding (dark square with "cm" wordmark) — swap in real artwork later by editing the SVG in the script and re-running `pnpm --filter @cmbot/web run gen:icons`. Build artefacts --------------- - `apps/web/public/icon-512.png`, `icon-192.png`, `apple-touch-icon.png` ARE committed (stable input). - `apps/web/public/sw.js` and `swe-worker-*.js` are NOT — they're regenerated on every production build. Added to `.gitignore`. Verification ------------ - Production build emits `[serwist] Bundling the service worker script with the URL '/sw.js' and the scope '/'...` and `sw.js` shows up in `public/`. - `/manifest.webmanifest` is in the build's static-route table. - 249 web tests still passing. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
51 lines
2.0 KiB
TypeScript
51 lines
2.0 KiB
TypeScript
import type { NextConfig } from "next";
|
|
import { join } from "node:path";
|
|
import withSerwistInit from "@serwist/next";
|
|
|
|
// Pin Turbopack's workspace root explicitly — pnpm + Turbopack can't always
|
|
// infer it inside Docker bind mounts.
|
|
const workspaceRoot = join(import.meta.dirname, "..", "..");
|
|
|
|
// We consume @cmbot/db and @cmbot/shared via their compiled dist (their
|
|
// package.json `main` points at ./dist/index.js). The dist is built at
|
|
// container start (see docker-compose.dev.yml) and during the production
|
|
// Docker build (see docker/web.Dockerfile). This sidesteps Turbopack's
|
|
// inability to resolve NodeNext-style `.js` extensions to `.ts` source.
|
|
const nextConfig: NextConfig = {
|
|
reactStrictMode: true,
|
|
output: "standalone",
|
|
outputFileTracingRoot: workspaceRoot,
|
|
// Allow Server Actions and dev HMR from the LAN host (phone testing).
|
|
// Tighten before exposing publicly via the reverse proxy.
|
|
allowedDevOrigins: ["192.168.0.253", "test.04080616.xyz", "rexwa.04080616.xyz"],
|
|
experimental: {
|
|
typedRoutes: true,
|
|
serverActions: {
|
|
// Default Server Action body limit is 1 MB — way under WhatsApp's
|
|
// 100 MB document cap. Lifted to 100 MB so document uploads reach
|
|
// the action; the per-kind WhatsApp validator
|
|
// (lib/whatsapp-media.ts) then enforces the actual limit
|
|
// (5 MB image / 16 MB video/audio / 100 MB document) and returns
|
|
// a useful error for the rest.
|
|
bodySizeLimit: "100mb",
|
|
},
|
|
},
|
|
turbopack: {
|
|
root: workspaceRoot,
|
|
},
|
|
};
|
|
|
|
// PWA: @serwist/next compiles `src/pwa/sw.ts` into `public/sw.js` at
|
|
// production build time, baking in the static-asset precache manifest.
|
|
// We disable it in dev because Turbopack + a service worker on every
|
|
// reload makes hot-reload extremely flaky.
|
|
const withSerwist = withSerwistInit({
|
|
swSrc: "src/pwa/sw.ts",
|
|
swDest: "public/sw.js",
|
|
cacheOnNavigation: true,
|
|
reloadOnOnline: true,
|
|
disable: process.env.NODE_ENV !== "production",
|
|
});
|
|
|
|
export default withSerwist(nextConfig);
|