When

• a server is running at 0.0.0.0:3000
• Vite is running on default host with 3000 port

, the current behavior is:

As long as you are accessing with the address shown on start up, it will work.
When is this not working?

What isn't working is that vite doens't notice that it shouldn't use port 3000.

For example, running

npx create-next-app my-next-app
cd next-app
npm run dev

in one terminal, and then

npm create vite@latest my-vite-app -- --template react
cd my-vite-app
npx vite --port 3000

results in Vite starting a dev server at http://127.0.0.1:3000/ instead of choosing another port. When I access localhost:3000, I get responses from the other dev server instead of Vite..

If the first server had been Vite server as well, the second Vite server would have noticed and chosen another port

Port 3000 is in use, trying another one...

I might got what you mean. You don't want Vite to hijack the 3000 port. Am I correct?

Right, I'd like Vite to choose another port.

It makes sense to me 👍

Hello @thomasballinger. We like your proposal/feedback and would appreciate a contribution via a Pull Request by you or another community member. We thank you in advance for your contribution and are looking forward to reviewing it!

@thomasballinger I was looking at your issue but I did not reproduce, Vite started a server on a different port without any issue even with a 0.0.0.0 host. Do you still reproduce ?

@Scttpr How did you start the first server? edit: note that new versions of Vite seem to choose a random port by default, so you have to specify port 3000.

What isn't working is that vite doens't notice that it shouldn't use port 3000.

For example, running

npx create-next-app my-next-app
cd next-app
npm run dev

in one terminal, and then

npm create vite@latest my-vite-app -- --template react
cd my-vite-app
npx vite --port 3000

results in Vite starting a dev server at http://127.0.0.1:3000/ instead of choosing another port. When I access localhost:3000, I get responses from the other dev server instead of Vite..

If the first server had been Vite server as well, the second Vite server would have noticed and chosen another port

Port 3000 is in use, trying another one...

I did exactly this

What operating system (I tried on mac), maybe we're seeing differences there? Anyone else see this?

I'm on Archlinux with NodeJS 16.18.0, I tried as well with a basic :

python -m http.server 3000

One side and :

npx vite --port 3000

On the other hand and it automatically started on 3001, am I in the right scenario ?

Ok I reproduce with NodeJS 19.0.0, according to Vite inner code I would say this issue is related to how Node is able to detect used ports from its http core lib

I guess it didn't happen with python because python's http.server doesn't use SO_REUSEADDR by default.

I think it reproduced with Node.js 19 because Node.js 17+ resolves localhost to ::1 in some cases and python uses IPv4.

Ok I reproduce with NodeJS 19.0.0, according to Vite inner code I would say this issue is related to how Node is able to detect used ports from its http core lib

This is what I suspected as well although looking through the docs, node:http doesn't seem to distinguish the hostname alias localhost from one another, i.e. check if they're being set to 0.0.0.0 to detect collisions.

Can this to be merged in v3 too?

As a workaround, you can use this package https://www.npmjs.com/package/portfinder-sync
It works perfect on all my projects. I don't know why vite is doing this in other way

import portfinder from "portfinder-sync";

const config = defineConfig({
  server: {
    host: "127.0.0.1",
    port: portfinder.getPort(3000),
  }
});

export default config;

For better typescript support you can add a declaration file.

declare module "portfinder-sync" {
  export function getPort(port: number): number;
}