How to cofigure HMR with nuxt 3 + vite on Gitpod web (behind proxy)

Question

I'm new to nuxt and having trouble getting HMR websocket connection configured on a nuxt project and running in Gitpod. The project uses nuxt 3 + vite.

After running yarn dev the dev server is running on port 3000 and the frontend tries to connect via websocket to the vite dev server running on port 24678.

Unfortunately the servers are exposed on Gitpod environments via a reverse proxy and on https endpoints. So the internal servers are running on the defined ports and are publicly exposed on different SSL endpoints like https://3000-CONTAINER_ID.gitpod.io/ and https://24678-CONTAINER_ID.gitpod.io/. But the HMR tries to connect by default to ws://3000-CONTAINER_ID.gitpod.io:24678/_nuxt/.

I tried to adjust the vite HMR config on nuxt, but I'm out of luck. The closest I came to what I wanted to achieve was this config:

export default defineNuxtConfig({
    ...
    server: {
      hmr: {
        protocol: 'wss',
        clientPort: 443,
      },
      proxy: {
        '/_nuxt': 'http://localhost:24678/_nuxt',
      }
    },
    ...
});

With this the websocket URL in the frontend looks right, being: wss://3000-CONTAINER_ID.gitpod.io/_nuxt/, but I get an WebSocket connection to ... failed. with an [vite] server connection lost. polling for restart... resulting in a page reload endless loop.

I prepared a git repo that could be directly started in Gitpod.

Any help to create the right setup to automate my dev environment with Gitpod would be awesome.