docs: FRONTEND.md auf Linux korrigiert (NodeSource statt Homebrew, Build direkt auf Server)

This commit is contained in:
cynfo3000 2026-03-06 09:36:26 +01:00
parent 28ebb5378d
commit a163037ee8

View File

@ -15,16 +15,24 @@ React + Vite + TailwindCSS Web-Frontend, deployed als statische Dateien über Ng
---
## 1. Voraussetzungen (Build-System)
## 1. Voraussetzungen (Frontend-Server: Debian/Ubuntu)
Build läuft auf dem Mac / Entwicklungsrechner, **nicht** auf dem Frontend-Server.
Build und Serving laufen auf demselben Linux-Server.
```bash
# Node.js 20+ installieren (macOS mit Homebrew)
brew install node
# Node.js 20+ über NodeSource-Repository installieren
curl -fsSL https://deb.nodesource.com/setup_20.x | bash -
apt install -y nodejs
# Abhängigkeiten installieren (einmalig nach Clone)
cd frontend
# Version prüfen
node -v # → v20.x.x
npm -v # → 10.x.x
# Repo klonen
git clone https://git.cynfo.net/christian/rmm2.git /opt/rmm
cd /opt/rmm/frontend
# Abhängigkeiten installieren (einmalig)
npm install
```
@ -131,34 +139,34 @@ nginx -t && systemctl reload nginx
---
## 6. Deploy
### Manuell
## 6. Deploy (auf dem Frontend-Server selbst)
```bash
cd frontend
cd /opt/rmm/frontend
# Alten Build löschen (Pflicht — Vite nutzt Hash-basierte Dateinamen)
rm -rf dist/ /var/www/html/assets/*
# Build erstellen
npm run build
ssh root@FRONTEND_SERVER 'rm -rf /var/www/html/assets/*' # Alte Hashes löschen!
scp -r dist/* root@FRONTEND_SERVER:/var/www/html/
ssh root@FRONTEND_SERVER 'nginx -s reload'
# In Nginx-Webroot kopieren
cp -r dist/* /var/www/html/
# Nginx neu laden
nginx -s reload
```
**Wichtig:** `assets/*` MUSS vor dem Deploy gelöscht werden — Vite generiert Hash-basierte
Dateinamen (`index-Dv2B5kJs.js`). Alte Dateien bleiben sonst auf dem Server und
der Browser-Cache liefert 404-Fehler.
**Wichtig:** `assets/*` MUSS vor jedem Deploy gelöscht werden — Vite generiert Hash-basierte
Dateinamen (`index-Dv2B5kJs.js`). Alte Dateien bleiben sonst liegen und der Browser
bekommt beim nächsten Laden 404-Fehler.
### Mit deploy-script (empfohlen)
Das Skript `deploy-frontend.sh` im Root-Verzeichnis erledigt Build + Deploy + Nginx-Reload
in einem Schritt. Server-IP und Webroot am Anfang des Skripts anpassen:
### Als Einzeiler (nach Änderungen am Code)
```bash
# deploy-frontend.sh — Variablen anpassen:
REMOTE="root@192.168.85.20" # IP des Frontend-Servers
WEB_ROOT="/var/www/html"
# Dann ausführen:
./deploy-frontend.sh
cd /opt/rmm && git pull && cd frontend && npm install && \
rm -rf dist/ /var/www/html/assets/* && npm run build && \
cp -r dist/* /var/www/html/ && nginx -s reload && echo "Deploy fertig"
```
---
@ -175,15 +183,25 @@ Passwort sofort ändern unter **Einstellungen → Benutzer**.
---
## 8. Lokale Entwicklung
## 8. Lokale Entwicklung (optional)
```bash
cd frontend
cd /opt/rmm/frontend
npm run dev
```
Startet Vite Dev-Server auf `http://localhost:5173` mit Hot-Reload.
API-Calls werden per Proxy an das Backend weitergeleitet (→ `vite.config.js` anpassen).
Startet Vite Dev-Server auf `http://FRONTEND_IP:5173` mit Hot-Reload.
API-Calls werden per Proxy an das Backend weitergeleitet — `vite.config.js` anpassen:
```js
proxy: {
'/api': {
target: 'https://192.168.85.13:8443', // Backend-IP
changeOrigin: true,
secure: false,
}
}
```
---