Why Your AI-Generated Next.js App Works Locally but Dies on Vercel
Four hours of vibe coding, perfect local dev, then a Vercel build fails on a case-sensitive import the model "fixed" once. Here is how to catch it before the PR.
You vibe-coded for four hours. The dashboard renders. Auth works. The AI agent closed twelve todos. You push, open the PR, and Vercel replies with a red X: Module not found: Can't resolve './component'. You stare at the file list. The component exists — as Component.tsx. Somewhere in the diff, the model renamed the import to lowercase in one file and left the filename alone. macOS never complained. Linux did.
Why `next dev` lies to you
Development mode optimizes for speed, not parity. Hot reload, loose transpilation, and skipped routes mean you can ship a green localhost and still fail the production compiler. TypeScript errors that never block dev can hard-fail `next build`. Dynamic imports the model added without `ssr: false` can explode during static analysis. Tree-shaking exposes dead imports the dev server never evaluated.
Same repo, different rules.
| Check | `next dev` | Vercel `next build` |
|---|---|---|
| Filesystem | Often case-insensitive (macOS default) | Linux — case-sensitive module resolution |
| TypeScript | Errors may not block the dev server | Compile errors fail the deployment |
| Env vars | Reads `.env.local` on your machine | Uses Vercel project env per environment |
| AI import edits | Wrong casing may still resolve | Module not found — build stops |
The failure is rarely mysterious once you treat Vercel as the source of truth, not your laptop.
The three failures we see most on AI Next.js repos
A 10-minute pre-push ritual
- 1Does production build pass locally?Run `npm run build` or `pnpm build`. If it fails here, it will fail on Vercel. Fix before opening the PR.
- 2Are import paths consistent with filenames?Search for renamed components. On macOS, run `git config core.ignorecase false` in the repo or use a Linux CI job to catch casing regressions early.
- 3Are Preview env vars set?Open Vercel → Settings → Environment Variables. Confirm Preview has every key your feature reads, not just Production.
- 4Did TypeScript run in strict mode?Run `tsc --noEmit` if your build script skips full type-check. AI-generated props and `any` casts love to hide here.
Commands that mirror Vercel
# Match what Vercel runs
pnpm install --frozen-lockfile
pnpm build
# Optional: type-check explicitly
pnpm exec tsc --noEmitCatch failures before merge
Manual rituals help, but the durable fix is verifying the PR in an environment that behaves like Vercel — not re-running the same local dev command and hoping. Our guide on Vercel build failures on pull requests walks through running builds in ephemeral sandboxes, catching TypeScript and circular-import errors on the branch, and treating Preview deploys as a merge gate rather than a surprise. Read it at /vercel-build-failed-on-pull-request if you want the full playbook.
Critique can run sandbox verification against your PR: install, build, and test in an isolated Linux environment so case sensitivity and compile failures surface as review evidence before your reviewer ever opens the diff. That is especially useful when the author is an agent that does not remember yesterday's import path.
FAQ
Stop shipping green localhost, red Vercel
Connect Critique to GitHub and verify your next AI-generated PR builds in a Linux sandbox before it merges.
Start free