---
title: "Vite Preview Server"
status: "active"
folder: "000-configs/tools"
tags: [tool, vite, preview, dev-server]
created: "2026-07-29"
updated: "2026-07-29"
version: "1.0.0"
---

# Vite Preview Instructions for Open WebUI Coding AI

Use this when the user asks to make a Vite/React app live, visible, public, previewable, or available at the preview URL.

## Public Preview URL

The stable public preview URL is:

```text
https://preview.boogerclub.com
```

Caddy on the host already proxies this hostname to the `open-terminal` container on port `5173`:

```text
preview.boogerclub.com -> open-terminal:5173
```

Do not change the Open WebUI URL. Open WebUI stays at:

```text
https://openwebui.boogerclub.com
```

## Where Apps Live

Inside the Open WebUI terminal container:

```text
/home/user/projects
/home/user/repos
```

On the host these map to:

```text
/home/ubuntu/openwebui/projects
/home/ubuntu/repos
```

## Start Command

For a Vite app, run this from the app directory:

```bash
npm run dev -- --host 0.0.0.0 --port 5173
```

Only one app can use the public preview slot at a time. If port `5173` is already in use, stop the old Vite dev server before starting the new one.

## Required Vite Host Allowlist

If the preview URL shows this error:

```text
Blocked request. This host ("preview.boogerclub.com") is not allowed.
To allow this host, add "preview.boogerclub.com" to `server.allowedHosts` in vite.config.js.
```

Add this to `vite.config.ts` or `vite.config.js`:

```ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  server: {
    allowedHosts: ['preview.boogerclub.com'],
  },
})
```

If the config already has a `server` block, add only:

```ts
allowedHosts: ['preview.boogerclub.com']
```

Then restart Vite with:

```bash
npm run dev -- --host 0.0.0.0 --port 5173
```

## Verification

From inside the terminal container, verify Vite is running:

```bash
curl -I http://127.0.0.1:5173
```

Expected result:

```text
HTTP/1.1 200 OK
```

From the public internet, verify the live preview:

```bash
curl -I https://preview.boogerclub.com
```

Expected result:

```text
HTTP/2 200
via: 1.1 Caddy
```

Also confirm Open WebUI still works:

```bash
curl -I https://openwebui.boogerclub.com
```

Expected result:

```text
HTTP/2 200
```

## Common Fixes

- `502` from `https://preview.boogerclub.com`: Caddy is up, but no Vite server is listening on `open-terminal:5173`. Start the app with the standard command.
- `Blocked request... host is not allowed`: add `preview.boogerclub.com` to `server.allowedHosts` in the app's Vite config and restart Vite.
- App works at `127.0.0.1:5173` but not the public URL: check `allowedHosts`, then check DNS for `preview.boogerclub.com`.
- Open WebUI should not be moved to the preview URL. Keep it on `https://openwebui.boogerclub.com`.

## Current Known Working Example

The current working example app is:

```text
/home/user/projects/candlestick-dashboard
```

It is configured with:

```ts
server: {
  allowedHosts: ['preview.boogerclub.com'],
}
```