All packsOffline Sync EngineSolve
dexie indexeddb not defined next.js server side rendering
next build prerenders client components once, on the server
A top-level Dexie/IndexedDB import throws indexedDB is not defined during Next.js's build-time prerender, even inside a component marked as client-only.
What goes wrong
Marking a component "use client" tells React it can run in the browser, but Next.js's next build step still prerenders every page once on the server to generate its initial HTML -- including client components. A module that imports Dexie (or anything else that touches IndexedDB) at the top level throws indexedDB is not defined the instant that prerender runs, because there is no browser IndexedDB API available during a server-side build step, client-component marking notwithstanding.
Why agents get it wrong
"use client" reads as a complete answer to "this needs the browser" -- it's the documented mechanism for exactly that -- so it's a reasonable but incorrect inference that everything inside a client component is safe to run only in the browser. The build-time prerender step that also executes client components is a Next.js implementation detail that isn't obvious from the client/server component mental model alone.
What Offline Sync Engine pre-decides
The demo page creates the sync engine inside a useEffect via a dynamic import ("../src/sync/browser") -- browser.ts is the only module in the pack that imports dexie-storage, and dynamic import() defers loading it until the effect actually runs in the browser, after mount, never during the server-side prerender. The two sync API routes additionally declare export const dynamic = "force-dynamic" so Next.js never tries to evaluate them (and the database pool they'd open) at build time either.
Source: ARCHITECTURE.md 'Next.js traps (pre-decided so the build passes first try)', item 1