Unable to connect to Vite server

When compiling my assets (vite build), there is no problem. But when working with the local server (vite) I'm suffering issues since I switched to Windows 11.

I narrowed down the problem to the fact that the request to [::1] remains pending. So the browser cannot connect to Vite to load the assets. The problem is not the IPv6 address (as surfing to [::1] correctly shows me the localhost page). I did also disable all virus and firewall app, and that did not make a difference neither.

When running Vite, I get to see the normal expected screen

VITE v4.3.9  ready in 4114 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h to show help

  LARAVEL v10.14.1  plugin v0.7.8

  ➜  APP_URL: http://reto2.test

It however seems to block there as well, as pressing h or q does not lead to any action. And the terminal (console emulator) in which it runs, jumps to 40% of my CPU usage.

Project based issue?

What makes it even stranger: in one other project, that uses LARAVEL v9.52.7 plugin v0.7.4 Vite works. With exactly the same configuration files (package.json, tailwind.config.js, vite.config.js), but also with an excessive high cpu load. With a responsive terminal (slow however). When I try to force the Laravel Vite Plugin to that version in the above configuration (LARAVEL v10.14.1 plugin v0.7.4) the problem is not solved. The request remains pending and the vite terminal remains unresponsive. Conclusion of this is that in one project vite works, in another not at all. So it must be a configuration issue?

I'm looking already for about a week to solve this problem, but don't manage, so pretty desperate by now. Any comment, suggestion, solution (I don't dare to hope for this) that can point me a step in the right direction is welcome!

LaryAI

2 years ago

Level 58

Based on the information provided, it seems that the Vite server is not able to establish a connection with the browser, resulting in pending requests. Here are a few steps you can try to resolve the issue:

Check if the port specified in the Vite server configuration (in this case, port 5173) is not being used by any other process. You can use the following command in the terminal to check for any conflicting processes:
```
netstat -ano | findstr :5173
```
If any process is using the port, you can either terminate that process or change the port number in the Vite server configuration.
Ensure that your firewall or antivirus software is not blocking the connection. Even though you mentioned that you disabled them, double-check to make sure they are completely turned off or add an exception for the Vite server.
Try running the Vite server with the --host flag to explicitly specify the host. For example:
```
vite --host localhost
```
Update your Vite and Laravel Vite Plugin versions to the latest stable releases. You can do this by running the following commands in your project directory:
```
npm install vite@latest
composer require laravel/vite-plugin@latest
```
If none of the above steps work, you can try reinstalling Vite and its dependencies. Delete the node_modules directory and reinstall the dependencies using the following commands:
```
npm install --force
```

If the issue still persists, it might be worth checking the Vite documentation or reaching out to the Vite community for further assistance.

ndeblauw

2 years ago

Level 10

Running netstat -ano | findstr :5173 results in:

TCP    [::1]:5173             [::]:0                 LISTENING       7308

So it seems that the port is listening (when running vite). When vite is not running, it simply returns nothing.

After updating (point 4 of Lary's answer), running netstat results in

TCP    [::1]:5173             [::]:0                 LISTENING       7324

(so a change in number at the end).

When I run netstat at the same time as a request from the browser is ongoing, I get to see the info below (but I don't know how to interpret this)

TCP    [::1]:5173             [::]:0                 LISTENING       7324
  TCP    [::1]:5173             [::1]:53473            ESTABLISHED     7324
  TCP    [::1]:5173             [::1]:53477            ESTABLISHED     7324
  TCP    [::1]:5173             [::1]:53478            ESTABLISHED     7324
  TCP    [::1]:53473            [::1]:5173             ESTABLISHED     24388
  TCP    [::1]:53477            [::1]:5173             ESTABLISHED     24388
  TCP    [::1]:53478            [::1]:5173             ESTABLISHED     24388

A force reinstall (point 5 of Lary's answer) does not change anything

ndeblauw

2 years ago

Level 10

Just in case someone is reading this later... The solution lied in completely removing the project and installing it again. I have no clue what went wrong in the original installation, but it was clearly (well, euh, after looking for the cause for hours ;-)) a hitch of the system

Please or to participate in this conversation.