Projektarbeit-MYP/backend/build-kiosk-css.ps1
2025-06-01 23:41:02 +02:00

151 lines
6.3 KiB
PowerShell

# MYP Platform - Kiosk CSS Build Script (PowerShell)
# Optimiert und minifiziert CSS für maximale Performance im Offline-Kiosk-Modus
Write-Host "Starte Kiosk CSS Build..." -ForegroundColor Green
# Erstelle Build-Verzeichnis
if (!(Test-Path "static\css\build")) {
New-Item -ItemType Directory -Path "static\css\build" -Force | Out-Null
}
# Prüfe ob Quelldateien existieren
if (!(Test-Path "static\css\kiosk-optimized.css")) {
Write-Host "FEHLER: static\css\kiosk-optimized.css nicht gefunden!" -ForegroundColor Red
exit 1
}
if (!(Test-Path "static\css\icons-minimal.css")) {
Write-Host "FEHLER: static\css\icons-minimal.css nicht gefunden!" -ForegroundColor Red
exit 1
}
if (!(Test-Path "static\css\critical-inline.css")) {
Write-Host "FEHLER: static\css\critical-inline.css nicht gefunden!" -ForegroundColor Red
exit 1
}
# Erstelle eine kombinierte CSS-Datei in korrekter Reihenfolge
Write-Host "Kombiniere CSS-Dateien..." -ForegroundColor Yellow
$timestamp = Get-Date -Format "yyyy-MM-dd HH:mm:ss"
$header = @"
/* MYP Platform - Kiosk Optimierte CSS Bundle */
/* Generiert am: $timestamp */
"@
# CSS-Dateien in optimaler Reihenfolge kombinieren
Write-Host "Lade kiosk-optimized.css..." -ForegroundColor Gray
$kioskCSS = Get-Content "static\css\kiosk-optimized.css" -Raw -Encoding UTF8
Write-Host "Lade icons-minimal.css..." -ForegroundColor Gray
$iconsCSS = Get-Content "static\css\icons-minimal.css" -Raw -Encoding UTF8
# Kombiniere CSS-Inhalte
$combinedCSS = $header + $kioskCSS + "`r`n`r`n" + $iconsCSS
# TailwindCSS mit aggressivem Purging bauen
Write-Host "Purge TailwindCSS..." -ForegroundColor Yellow
try {
$process = Start-Process "npx" -ArgumentList "tailwindcss", "-i", "static\css\input.css", "-o", "static\css\build\tailwind-purged.css", "--minify" -Wait -PassThru -NoNewWindow
if ($process.ExitCode -eq 0) {
Write-Host "TailwindCSS erfolgreich gebaut" -ForegroundColor Green
$tailwindCSS = Get-Content "static\css\build\tailwind-purged.css" -Raw -Encoding UTF8
$combinedCSS += "`r`n`r`n" + $tailwindCSS
} else {
Write-Host "TailwindCSS Build fehlgeschlagen, verwende ohne Tailwind" -ForegroundColor Yellow
}
} catch {
Write-Host "TailwindCSS Build fehlgeschlagen: $($_.Exception.Message)" -ForegroundColor Yellow
}
# Kombinierte CSS speichern
Write-Host "Speichere kombinierte CSS..." -ForegroundColor Gray
$combinedCSS | Out-File -FilePath "static\css\build\kiosk-combined.css" -Encoding UTF8
# CSS minifizieren (falls cssnano verfügbar)
Write-Host "Minifiziere CSS..." -ForegroundColor Yellow
try {
$process = Start-Process "npx" -ArgumentList "cssnano", "static\css\build\kiosk-combined.css", "static\css\build\kiosk-production.css", "--no-map" -Wait -PassThru -NoNewWindow
if ($process.ExitCode -eq 0) {
Write-Host "CSS erfolgreich minifiziert" -ForegroundColor Green
} else {
Write-Host "cssnano fehlgeschlagen, verwende unminifizierte Version" -ForegroundColor Yellow
Copy-Item "static\css\build\kiosk-combined.css" "static\css\build\kiosk-production.css"
}
} catch {
Write-Host "cssnano nicht verfügbar, verwende unminifizierte Version" -ForegroundColor Yellow
Copy-Item "static\css\build\kiosk-combined.css" "static\css\build\kiosk-production.css"
}
# Erstelle kritisches CSS für Inline-Verwendung
Write-Host "Erstelle kritisches CSS..." -ForegroundColor Yellow
Copy-Item "static\css\critical-inline.css" "static\css\build\critical.css"
# Erstelle eine Version ohne FontAwesome
Write-Host "Entferne FontAwesome-Abhängigkeiten..." -ForegroundColor Yellow
if (Test-Path "static\css\build\kiosk-production.css") {
$content = Get-Content "static\css\build\kiosk-production.css" | Where-Object { $_ -notmatch "fontawesome" }
$content | Out-File -FilePath "static\css\build\kiosk-no-fa.css" -Encoding UTF8
}
# Dateigröße-Analyse
Write-Host ""
Write-Host "Dateigröße-Analyse:" -ForegroundColor Cyan
if (Test-Path "static\css\build\critical.css") {
$criticalSize = (Get-Item "static\css\build\critical.css").Length
Write-Host "Critical CSS (inline): $criticalSize bytes"
}
if (Test-Path "static\css\build\kiosk-production.css") {
$kioskSize = (Get-Item "static\css\build\kiosk-production.css").Length
Write-Host "Kiosk Production CSS: $kioskSize bytes"
}
if (Test-Path "static\css\build\kiosk-no-fa.css") {
$noFaSize = (Get-Item "static\css\build\kiosk-no-fa.css").Length
Write-Host "Ohne FontAwesome: $noFaSize bytes"
}
# Vergleich mit Original-Dateien
if ((Test-Path "static\css\tailwind.min.css") -and (Test-Path "static\css\build\kiosk-production.css")) {
$originalSize = (Get-Item "static\css\tailwind.min.css").Length
$optimizedSize = (Get-Item "static\css\build\kiosk-production.css").Length
if ($originalSize -gt 0) {
$reduction = [math]::Round((1 - ($optimizedSize / $originalSize)) * 100, 1)
Write-Host "TailwindCSS Original: $originalSize bytes"
Write-Host "Größenreduktion: $reduction%" -ForegroundColor Green
}
}
# Cache-Busting Hash generieren
if (Test-Path "static\css\build\kiosk-production.css") {
$hash = (Get-FileHash "static\css\build\kiosk-production.css" -Algorithm SHA256).Hash.Substring(0, 8).ToLower()
Copy-Item "static\css\build\kiosk-production.css" "static\css\build\kiosk-$hash.css"
Write-Host ""
Write-Host "Build abgeschlossen!" -ForegroundColor Green
Write-Host ""
Write-Host "Generierte Dateien:" -ForegroundColor Cyan
Write-Host " • static\css\build\critical.css (inline verwenden)"
Write-Host " • static\css\build\kiosk-production.css (Haupt-CSS)"
Write-Host " • static\css\build\kiosk-$hash.css (mit Cache-Busting)"
Write-Host ""
Write-Host "HTML-Integration:" -ForegroundColor Cyan
Write-Host ' <style>/* Inhalt von critical.css hier einfügen */</style>'
Write-Host ' <link rel="stylesheet" href="/static/css/build/kiosk-production.css">'
Write-Host ""
Write-Host "Für maximale Performance: Service Worker entfernen und nur statische CSS verwenden" -ForegroundColor Blue
}
# Cleanup temporärer Dateien
if (Test-Path "static\css\build\kiosk-combined.css") {
Remove-Item "static\css\build\kiosk-combined.css"
}
if (Test-Path "static\css\build\tailwind-purged.css") {
Remove-Item "static\css\build\tailwind-purged.css"
}
Write-Host "Cleanup abgeschlossen" -ForegroundColor Green