"vercel dev" not working with vite - hangs indefinitely

[sargant]

I'm having trouble getting Vite to work with the vercel dev command. HTTP requests never load, and time out after 5 minutes.

Replicable environment steps:

• npm init vite@latest vercel-test --template vanilla
• cd vercel-test && npm install
• npm install --save-dev vercel@23.1.2
• In package.json, add "start": "vercel dev" to scripts
• npm start and point a browser at http://localhost:3000

The request remains pending for five minutes before eventually timing out.

I've tried it with create-react-app instead of vite and it works fine; and the vite dev command works fine by itself independently.

[sargant]

Seems like the problem is that the default Development Command for Vite projects doesn't work out of the box.

The default is vite - overriding it to vite --port $PORT works.

[REX500]

This doesn't really help since when i run vercel dev, one of the 2nd arguments that get logged out are:

> Running Dev Command “vite --port $PORT”
> Ready! Available at http://localhost:3000

However, when I navigate to localhost:3000 on my browser, I get

GET http://localhost:3000/src/main.tsx net::ERR_ABORTED 404 (Not Found)

type errors... My vite app works just fine if I run it with yarn dev but with vercel dev it doesn't. Note: my app works just fine on Vercel itself...

[REX500]

I am guessing that I need to create something like vercel.config.ts file? I tried finding docs on this but to no avail... all of them point to servless setup but not the local vercel server itself...

[nicehatharry]

You need to set the dev command in your vercel.json

https://vercel.com/docs/projects/project-configuration#devcommand

[AlenDavid]

Hey, it seems this is still happening, now for node 18.

[martin-dimi]

Hey, I'm having the same issue. Any workarounds? We can't set another default port