API Routes Return Blank Page Instead of JSON

Currently, all of our API endpoints (e.g., /api/hello) deployed on Vercel return a blank page or HTML instead of the expected JSON response. The serverless functions are listed in the Vercel dashboard, but when accessed, they do not return any data.

Expected: Hitting an API endpoint like /api/hello should return a JSON response from the corresponding serverless function.

Code, configuration, and steps that reproduce this issue:

  • /api folder is at the project root and contains valid serverless function files

  • Vite build output and Vercel static build directory have both been set to dist and previously to dist/public (no change).

  • Top-level public folder has been renamed/removed to avoid static file conflicts.

  • All rewrites have been removed from vercel.json.

  • Functions appear in the Vercel dashboard, but show “no data in the time range” and do not respond with JSON.

  • No build errors or warnings in the Vercel logs.

Steps to reproduce:

  1. Deploy project to Vercel with the above structure and config.

  2. Visit /api/hello (or any API route).

  3. Observe blank page or HTML instead of JSON.

Project info:

  • Framework: Vite (React + TypeScript)

  • API: Vercel serverless functions in /api (TypeScript)

  • Frontend build output: dist

  • Project root contains:

  • api/ (at top level)

  • client/

  • dist/

  • migrations/

  • node_modules/

  • public_backup/ (was public, now renamed)

  • server/

  • shared/

  • test/

  • uploads/

  • vercel.json

  • package.json

  • Vercel project settings:

  • Root Directory: blank

  • Output Directory: dist

  • Framework Preset: Vite

  • Only one package.json at the top level

  • No top-level public folder (renamed to public_backup)

  • Functions are listed in the Vercel dashboard but not returning data

  • No build errors or warnings in the Vercel logs

The first step is to check if your serverless functions are actually being deployed. In your deployment, underneath build logs you can see Deployment summaryServerless Functions which should have a list of them like this

/api/hello
/api/world

If you aren’t seeing those, double check to make sure your files are in the correct directories.

If they ARE there, and you don’t have any rewrites set up, then you should be able to access it at exactly that URL

GET example.com/api/hello

Make sure you’re entering them exactly as they’re listed. I once had a custom build config that included file extensions under my deployment summary and then I’d have had to go to /api/hello.ts in the browser to access it