# Vite Multi-Domain Setup

## Übersicht

Dieses Projekt verwendet **2 separate Vite-Ports** für unterschiedliche Domain-Bereiche:

| Bereich | Port | Vite Config | Tailwind Config | Domains | FluxUI |
|---------|------|-------------|-----------------|---------|--------|
| **Backend (Portal)** | 5177 | `vite.portal.config.js` | `tailwind.portal.config.js` | `pressekonto.test` | ✅ Ja |
| **Frontend (Web)** | 5178 | `vite.web.config.js` | `tailwind.web.config.js` | `presseecho.test`, `businessportal24.test` | ❌ Nein |

## Warum 2 Ports?

### Ein Port reicht NICHT aus, weil:
- Vite kann nur **eine Konfiguration gleichzeitig** ausführen
- Backend nutzt **FluxUI** (flux-pro/flux), Frontend nicht
- Unterschiedliche **Build-Verzeichnisse** (`build/portal` vs `build/web`)
- Unterschiedliche **Tailwind-Konfigurationen**

### Frontend-Domains teilen sich einen Port, weil:
- Beide nutzen die **gleichen Views/Components**
- Unterschiede nur in **CSS-Variablen** (Theme-Farben)
- **ThemeServiceProvider** entscheidet zur Laufzeit welches Theme geladen wird

## Development Server starten

### Option 1: Beide Server gleichzeitig starten (empfohlen)
```bash
npm run dev:all
```
Startet beide Vite-Server parallel mit `concurrently`

### Option 2: Nur Backend (Portal)
```bash
npm run dev:portal
```
- Port: 5177
- HMR-Host: assets.pressekonto.test
- Domain: pressekonto.test

### Option 3: Nur Frontend (Web)
```bash
npm run dev:web
```
- Port: 5178
- HMR-Host: assets-web.pressekonto.test
- Domains: presseecho.test, businessportal24.test

## Production Build

### Alle Builds erstellen
```bash
npm run build
```
Erstellt beide Builds nacheinander

### Einzelne Builds
```bash
npm run build:portal  # Nur Backend
npm run build:web     # Nur Frontend
```

## Port-Übersicht

| Port | Service | Beschreibung |
|------|---------|--------------|
| 5177 | Vite Portal | Backend Dev Server mit FluxUI |
| 5178 | Vite Web | Frontend Dev Server (Presseecho & Businessportal24) |
| 33069 | MySQL | Datenbank |
| 6382 | Redis | Cache |
| 8027 | Mailpit | E-Mail Dashboard |

## Build-Verzeichnisse

```
public/
├── build/
│   ├── portal/          # Backend Assets
│   │   ├── manifest.json
│   │   └── assets/
│   └── web/             # Frontend Assets (beide Domains)
│       ├── manifest.json
│       └── assets/
```

## Theme-System

### Backend (Portal)
- **Domain:** pressekonto.test
- **Theme:** `portal`
- **CSS:** `resources/css/portal.css`
- **Views:** `resources/views/portal/**`
- **FluxUI:** Ja (flux-pro/flux)

### Frontend (Presseecho)
- **Domain:** presseecho.test
- **Theme:** `presseecho`
- **CSS:** `resources/css/web/theme-presseecho.css`
- **Views:** `resources/views/web/**`
- **Farben:** Über CSS-Variablen in theme-presseecho.css

### Frontend (Businessportal24)
- **Domain:** businessportal24.test
- **Theme:** `businessportal24`
- **CSS:** `resources/css/web/theme-businessportal24.css`
- **Views:** `resources/views/web/**`
- **Farben:** Über CSS-Variablen in theme-businessportal24.css

## Traefik / HMR-Setup

Beide Vite-Server laufen intern auf HTTP (`https: false`), Traefik übernimmt SSL-Terminierung:

- **Portal HMR:** `wss://assets.pressekonto.test` → Port 5177
- **Web HMR:** `wss://assets-web.pressekonto.test` → Port 5178

## Troubleshooting

### HMR funktioniert nicht
1. Prüfe ob beide Vite-Server laufen: `npm run dev:all`
2. Prüfe Traefik-Routing für HMR-Hosts
3. Browser-Console checken für WebSocket-Fehler

### Styles werden nicht geladen
1. Prüfe ob der richtige Vite-Server für die Domain läuft
2. Prüfe `ThemeServiceProvider` Konfiguration
3. Build-Manifest prüfen: `public/build/portal/manifest.json` oder `public/build/web/manifest.json`

### Port bereits belegt
```bash
# Port-Nutzung prüfen
lsof -i :5177
lsof -i :5178

# Prozess beenden
kill -9 <PID>
```

## Deprecated Files

Diese Dateien werden nicht mehr verwendet:
- ❌ `vite.config.js` (alt)
- ❌ `tailwind.config.js` (alt)

Sie bleiben nur als Referenz erhalten.