Add proxy configuration for single-port development

Configure SvelteKit dev server to proxy API requests to Elysia backend,
allowing users to access the application on a single port (5173).

## Changes
- Add proxy config to vite.config.js for /api requests
- Update API client to use relative URLs (/api)
- Add convenience 'dev' script to start both servers
- Update README with single-port instructions
- Add architecture section explaining proxy setup

Benefits:
- Single port to access (5173)
- HMR still works for frontend
- No CORS issues
- Backend runs hidden on port 3001

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-16 08:16:58 +01:00
parent d959235cdd
commit afe150f15c
4 changed files with 41 additions and 15 deletions

View File

@@ -1,9 +1,10 @@
import { browser } from '$app/environment';
/**
* API base URL - change this to match your backend
* API base URL - proxied through SvelteKit dev server
* In production, this will be relative to the same origin
*/
const API_BASE = 'http://localhost:3001/api';
const API_BASE = '/api';
/**
* Make an API request

View File

@@ -38,6 +38,14 @@ export default defineConfig({
// Disable error overlay to dismiss URI malformed errors
hmr: {
overlay: false
},
// Proxy API requests to backend
proxy: {
'/api': {
target: 'http://localhost:3001',
changeOrigin: true,
secure: false,
}
}
}
});