Was macht pixel-perfect-website-clone-skill?
Codex-Fertigkeit zur pixelgenauen Website-Klonung mit OpenCLI, Browser Harness, Screenshots, Pixel-Diff und Reviewer-Agent-QA.
Übersicht
Diese Fertigkeit automatisiert den Prozess des pixelgenauen Klonens einer Website. Sie erstellt Screenshots der Originalseite, generiert die geklonte Version und vergleicht diese visuell mit einem Pixel-Diff-Tool. Ein Reviewer-Agent bewertet die Ergebnisse und stellt sicher, dass der Klon dem Original so nahe wie möglich kommt.
Funktionen
- OpenCLI-Integration: Führt Shell-Befehle aus, um den Klonprozess zu steuern
- Browser Harness: Steuert einen Headless-Browser zum Erstellen von Screenshots
- Pixel-Diff-Vergleich: Erkennt Abweichungen zwischen Original und Klon auf Pixelebene
- Reviewer-Agent-QA: Automatisierte Qualitätssicherung durch einen spezialisierten KI-Agenten
Voraussetzungen
- Codex (oder ein kompatibler KI-Agent)
- Node.js (Version 16 oder höher)
- Ein moderner Webbrowser (für das Browser Harness)
Installation
# Klone das Repository
Verwendung
- Definiere die Ziel-URL im Konfigurationsabschnitt
- Starte die Fertigkeit mit dem Befehl:
codex execute skill
Konfiguration
Die Konfiguration erfolgt über Umgebungsvariablen oder eine .env-Datei:
| Variable | Beschreibung | Standard |
|---|---|---|
TARGET_URL | URL der zu klonenden Website | - |
OUTPUT_DIR | Ausgabeverzeichnis für Screenshots und Klone | ./output |
BROWSER_WIDTH | Breite des Browser-Fensters in Pixeln | 1280 |
Lizenz
MIT