Demo, all content is generated
Question

npm run dev works fine but npm run build fails with a wall of type errors

Solved · 3101 views · asked by jakeypoo · edited

First time deploying. Vercel build fails with like 40 errors:

Type error: Property 'name' does not exist on type 'never'.
./app/dashboard/page.tsx:22:31
...
./components/Chart.tsx
12:7  Error: 'useEffect' is defined but never used.  @typescript-eslint/no-unused-vars

But the app runs perfectly with npm run dev! Why is the build stricter? Cursor suggests ignoreBuildErrors: true, should I?

What I’ve tried

Ran npm run build locally, same errors. Fixed a few with Cursor but it introduces new ones.

Comment
First deploy build errors are a rite of passage. Paste a couple of the type errors, most are the same root cause. ingrid_h · edited

3 answers

Marked as helpful by the asker
rafa_dev · edited

next dev only compiles what you open and skips type checking and linting for speed. next build checks the whole project. The errors were always there, dev just didn't tell you.

Don't set ignoreBuildErrors. A lot of these are real bugs waiting (type 'never' usually means Supabase/fetch data that TypeScript thinks can't exist, so .name may crash at runtime).

Workflow that works with Cursor:

  1. Run npx tsc --noEmit locally, it lists every type error without building.
  2. Give Cursor one file at a time: "fix the type errors in app/dashboard/page.tsx, don't change behavior, don't use any".
  3. Unused-variable lint errors: just delete the unused imports.
  4. Rerun tsc after each file.

40 errors sounds like a lot but usually it's 5 root causes repeated.

Comment
tsc --noEmit is great, I can see the count going down. 40 -> 12 so far jakeypoo · edited
0! Deployed. One of the 'never' ones was actually a real bug, the dashboard would have crashed for users with no projects. jakeypoo · edited
the 'one file at a time' tip is gold for cursor in general sam_builds · edited
Also add npm run build (or tsc) to a pre-push hook or CI so you find out before Vercel does. katja_s · edited
wes_codes · edited

If you absolutely need to ship tonight: eslint.ignoreDuringBuilds: true for the lint part only is a much smaller sin than ignoring type errors. Then fix lint later.

Comment
marco_py · edited

Temporary option some people use: set "strict": false in tsconfig to get the count down, then turn it back on. I'd only do that with a plan to turn it back on the same week.

Comment
I'd skip that. Turning strict back on later is where people give up. Fixing 40 errors file by file takes an evening. rafa_dev · edited
Fair, for a first deploy your route is cleaner. marco_py · edited