When --host option is used browsers show 404 for localhost

[Omarov3000]

Describe the bug

// dns.setDefaultResultOrder("verbatim"); // doesn't help

export default defineConfig({
  plugins: [react()],
  server: {
    host: "0.0.0.0",
  },
});

Vite prints addresses on start. If I open the one containing localhost (or set open: true in config) I get an error in all browsers:

This localhost page can’t be foundNo web page was found for the web address: http://localhost:5173/
HTTP ERROR 404

Note: my app is accessible via printed "network" address or using 127.0.0.1:5173

If --host option is not used I can access my app on localhost.

Reproduction

https://github.com/Omarov3000/vite--host-issue

Steps to reproduce

1. pnpm install
2. pnpm dev
3. open localhost:5173

System Info

System:
    OS: macOS 13.4
    CPU: (12) arm64 Apple M2 Pro
    Memory: 982.13 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.5.0 - ~/.nodenv/versions/20.5.0/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.8.0 - ~/.nodenv/versions/20.5.0/bin/npm
    pnpm: 8.10.2 - ~/.nodenv/versions/20.5.0/bin/pnpm
    bun: 1.0.3 - ~/.bun/bin/bun
  Browsers:
    Chrome Canary: 121.0.6117.0
    Edge: 119.0.2151.46
    Safari: 16.5
  npmPackages:
    @vitejs/plugin-react-swc: ^3.4.1 => 3.4.1 
    vite: ^4.5.0 => 4.5.0

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sapphi-red]

I guess your computer resolves localhost to ::1 instead of 127.0.0.1. 0.0.0.0 is an unspecified IPv4 address and it doesn't listen to ::1.
Maybe it will work if you set host: true or host: '::'.

[Omarov3000]

I tried both your suggestions but they don't help.

this is my hosts file content

127.0.0.1	localhost
255.255.255.255	broadcasthost
::1             localhost

[SharjeelSIqbal]

I've come across this issue, and what solved it for me was moving my index.html file to the base directory where vite.config.ts file was

[cbaquerog]

Oh my god thank you so much! I have been stuck with this error for more than two hours (I'm a beginner) and this solved it!