Ein Freund fragte mich, ob ich gute Methoden für die Code-Generierung aus Figma kenne. Seine derzeitige Vorgehensweise ist: Figma exportiert HTML-Code und lässt GitHub Copilot den exportierten Code gemäß dem Format der Komponenten in seinem Code-Repository umschreiben. Er findet es mühsam, den Code zu kopieren und einzufügen und dann eine Menge von Hinweisen zu schreiben, damit Copilot umschreibt. Ich bin mit Figma nicht sehr vertraut, habe ihm vorgeschlagen, die Ergebnisse von Figma direkt als Screenshot zu machen oder als PNG zu exportieren und dann den Screenshot an Copilot zu senden, damit Copilot basierend auf dem Screenshot die UI-Codes direkt generiert. Er sagte, dass die so erhaltenen Stile nicht so genau sind wie die aus Figma exportierten, schließlich hat Figma präzise Farben und Größen, während die von der KI generierten nicht so präzise sind. Ich habe ihm vorgeschlagen, beide Ansätze zu kombinieren, indem er sowohl den Code exportiert als auch Screenshots generiert und dann den Screenshot, den Figma exportierten Code und die Komponentenbeschreibung zusammen an die KI sendet (die Hinweise mit XML-Tags trennt), sodass sowohl die UI-Generierung als auch die Stilgenauigkeit berücksichtigt werden können. Referenzhinweise sind wie folgt: [UI-Design-Screenshot] <Figma exportierter Code> [Figma Code……] </Figma exportierter Code> <UI-Komponentenbeschreibung> [React UI-Komponentenbeschreibung……] </UI-Komponentenbeschreibung> Oben ist das UI-Design, der entsprechende Figma-Code, bitte beachten Sie die UI-Komponentenbeschreibung und verwenden Sie die von mir bereitgestellten UI-Komponenten, um den UI-Code neu zu generieren.