Modify Custom Plugin code cause unexpected 504

[childrentime]

Describe the bug

I am writing a custom Vite plugin to handle routing.

The plugin works fine, but when I comment out or add console statements in the load function, a 504 error is displayed on the webpage.

Reproduction

https://github.com/childrentime/vite-react-test

Steps to reproduce

Use npm run dev to start the app.

Visit http://localhost:5173/a route.

And go ./vitePlugns/pluginRoutes.js file, search FIXME word.

System Info

System:
    OS: macOS 13.3
    CPU: (10) arm64 Apple M1 Pro
    Memory: 89.31 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.18.0 - ~/.nvm/versions/node/v18.18.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 9.8.1 - ~/.nvm/versions/node/v18.18.0/bin/npm
    pnpm: 8.6.2 - ~/Library/pnpm/pnpm
    Watchman: 2023.09.04.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 116.0.5845.187
    Safari: 16.4
  npmPackages:
    @vitejs/plugin-react: ^4.0.4 => 4.0.4 
    vite: ^4.4.9 => 4.4.9

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.

[bluwy]

I can't reproduce this. It's running fine for me. The server seems to be restarting and perhaps the page fetched too eagerly that the server isn't ready yet? Does this also happen if you press the r shortcut in the Vite dev server to manually restart the server?

[childrentime]

@bluwy Did you try commenting out the console statements multiple times and then checking the page? It's possible that the issue may not occur in once change.

[childrentime]

video

2023-10-08.14.30.46.mov

[bluwy]

Thanks. Strangely I can reproduce it now with that exact steps.

[patak-dev]

This is fixed by:

• docs(ssr): properly handle vite.middlewares after restart #14917

See new docs at: https://main.vitejs.dev/guide/ssr.html#setting-up-the-dev-server

We need to use the new versions of Vite middlewares after a restart:

  app.use((req, res, next) => {
    vite.middlewares.handle(req, res, next)
  })

instead of

  app.use(vite.middlewares)