Coder.comC
Coder.com•3w ago
Thibault Chausson

Vite (React) returns blank page behind Coder code-server proxy (absolute paths / MIME error)

Hello,

I’m reaching out because I’m facing an issue with Coder’s proxy when developing with Vite (React).

When I run npm run dev, I get a blank page because main.jsx cannot be found, or I get a 404 error, depending on the vite.config configuration.

Analysis


1. The actual URL is:
https://mondomanie.com/@user/test.main/apps/code-server/proxy/5173/

2. The Vite server listens on localhost:5173 inside the workspace (when I run npm run dev).
3. The browser does not access localhost:5173 directly, but goes through the built-in code-server proxy.
4. When the browser requests /@vite/client or /src/main.jsx through the proxy, Vite does not recognize this path and returns index.html, resulting in a text/html MIME error in the console.
5. Even with a correct allowedHosts, HMR disabled, and base configured as
/@user/test.main/apps/code-server/proxy/5173/,
Vite does not understand that proxy paths should map to 
/
.

Consequences


- Vite generates <script type="module" src="/src/main.jsx"> using absolute paths (/src/...).
- Behind the proxy, the absolute path /src/... does not match the real URL, so the browser receives the proxy HTML page, hence the text/html MIME error.
- In other words, Vite thinks it is serving from 
/
, but the proxy adds a prefix (/@user/.../proxy/5173).

Vite configuration


/// <reference types="vitest" />
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  base: '/@user/test.main/apps/code-server/proxy/5173/',
  server: {
    host: true,
    allowedHosts: ['mondomanie.com']
  },
  plugins: [react()],
})


Issue


I get this error when I click on the forwarded ports notification in code-server.

Do you have any ideas on how to fix this issue?

Thank you in advance.

Best regards,
IMG_3069.jpg
Was this page helpful?