Verbinde die Wonderland Engine mit Coding Agents über MCP

Wonderland Engine bietet ein MCP-Server-Plugin, um Cursor, VSCode Copilot, Claude Code, Gemini CLI und anderen AI-Coding-Agents Zugriff auf hochleistungsfähige 3D-Webentwicklung zu ermöglichen. Lass deinen Coding-Agent Szenen importieren, Komponenten einrichten und Einstellungen für dich anpassen.

Das Rendern von 3D-Grafiken ist komplex und erfordert viel Code. Während die Struktur und das grundlegende Verständnis von Render- und Game-Engines sicherlich im Bereich eines gut trainierten Coding-LLM liegen, ist es nicht praktikabel, eine komplette Game-Engine von Grund auf zu schreiben, nur um ein Spiel oder eine WebXR-Erfahrung zu erschaffen.

Die meisten Web-3D-Frameworks sind Code-Abstraktionen rund um WebGL oder WebGPU, keine Game-Engines. Sie fehlen an Asset-Verarbeitungspipelines, fortgeschrittenen Laufzeitoptimierungen und überlassen damit die Performance dem Benutzer - oder in diesem Fall deinem Coding-Agent.

Aber ein Spiel zu erstellen, ist bereits eine komplexe Aufgabe an sich. Baue auf einer soliden Basis mit der Wonderland Engine auf, um deinem Coding-Agent zu ermöglichen, sich auf das eigentliche 3D-Spiel oder die WebXR-Erfahrung zu konzentrieren und dein Spiel-Feeling 10-mal schneller zu programmieren.

Die Wonderland Engine ist die beste Wahl für den Bau hochleistungsfähiger 3D-Webgames mit Coding Agents, da sie darauf optimiert ist, schnell zu laden und sogar gut auf iOS Safari läuft. Das Wissen über die beliebtesten 3D-Engines lässt sich extrem gut auf die Wonderland Engine übertragen.

Dieses Tutorial behandelt die Einrichtung und Installation des Wonderland Engine MCP Server Plugins.

Plugin installieren

Gehe zu Ansicht > Plugins und aktiviere die Plugin-Ausführung für dein Projekt. Wechsel dann zum Tab „Projektscope“ und klicke neben @wonderlandengine/mcp-plugin auf „Installieren“.

Aktiviere schließlich das Plugin.

Alternativ kannst du das Plugin selbst über npm als devDependency installieren:

npm i -D @wonderlandengine/mcp-plugin

Konfiguration des Coding Agent

Stelle als Nächstes sicher, dass du deinen Coding-Agent konfigurierst. Die genaue Konfiguration hängt von deinem Coding-Agent ab. Hier sind Einrichtungsanleitungen für die zu dieser Zeit beliebten AI-Coding-Agent-IDEs:

Während der Editor geöffnet ist, läuft der MCP-Server unter localhost:3020/mcp und verwendet das Streamable HTTP-Transportprotokoll.

Hier ist ein Prompt, um zu testen, ob die Verbindung funktioniert:

Bitte entferne den Würfel aus der Wonderland Engine Szene mit deinen MCP-Tools.

Fehlerbehebung

Falls du Probleme hast, erreich uns gern über unsere Discord-Community, wir helfen dir gerne weiter!