# Funplay Cocos MCP

Embeds an MCP server inside the Cocos Creator editor so an AI assistant can inspect and drive the running project.

- MCP server · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 357
- Author: FunplayAI
- License: MIT · policy=link-only · description only; the file stays with the author
- Source: https://github.com/FunplayAI/funplay-cocos-mcp
- Updated: 2026-10-20
- HTML: https://affpapa.org/en/nevibecode/mcp/funplay-cocos-mcp

## What it does

The extension installs into a Cocos Creator project and starts an HTTP MCP server inside the editor. From there the assistant calls `execute_javascript`: with `context: "scene"` the code runs in the active scene and runtime, with `context: "editor"` it runs in the editor context. That covers building a UI hierarchy under the active Canvas, attaching components, checking the result and capturing a screenshot.

Clients connect either by hand or through the built-in configuration window. The stdio bridge needs the server address: `FUNPLAY_COCOS_MCP_URL` holds the URL and `FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS` the timeout. With no editor open and no project loaded there is nothing to bridge to, because the server lives inside Cocos Creator rather than in its own process.

New projects get a port in the `20000–29999` range, while saved configurations keep their fixed one. If another listener already holds the port, the extension falls back to the next free one, so pin the port with **Pin Current Port** before wiring up a client. You can also install the extension globally for every project on one Creator version; in that case remove the copy under `extensions/`, otherwise MCP Settings flags a duplicate install.

## Requirements
- Needs: Node.js (commands run via npx)
- Environment variables: `FUNPLAY_COCOS_MCP_URL`, `FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS` — keys and tokens: ask the human for the values, never commit them or put them in shared files.

## Install

### Claude Code (native platform)

**Platform CLI**
```bash
claude mcp add --env FUNPLAY_COCOS_MCP_URL=<FUNPLAY_COCOS_MCP_URL> --env FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS=<FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS> --transport stdio funplay-cocos-mcp -- npx -y funplay-cocos-mcp
```
Replace <…> with your own values

### Codex

**Platform CLI**
```bash
codex mcp add funplay-cocos-mcp --env FUNPLAY_COCOS_MCP_URL=<FUNPLAY_COCOS_MCP_URL> --env FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS=<FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS> -- npx -y funplay-cocos-mcp
```
Replace <…> with your own values

### Cursor

**Config file**
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "funplay-cocos-mcp": {
            "command": "npx",
            "args": [
                "-y",
                "funplay-cocos-mcp"
            ],
            "env": {
                "FUNPLAY_COCOS_MCP_URL": "<FUNPLAY_COCOS_MCP_URL>",
                "FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS": "<FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS>"
            }
        }
    }
}
```
Replace <…> with your own values

### GitHub Copilot

**Config file**
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "funplay-cocos-mcp": {
            "type": "stdio",
            "command": "npx",
            "args": [
                "-y",
                "funplay-cocos-mcp"
            ],
            "env": {
                "FUNPLAY_COCOS_MCP_URL": "<FUNPLAY_COCOS_MCP_URL>",
                "FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS": "<FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS>"
            }
        }
    }
}
```
Replace <…> with your own values

### Gemini CLI

**Platform CLI**
```bash
gemini mcp add -e FUNPLAY_COCOS_MCP_URL=<FUNPLAY_COCOS_MCP_URL> -e FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS=<FUNPLAY_COCOS_MCP_TIMEOUT_SECONDS> funplay-cocos-mcp npx -y funplay-cocos-mcp
```
Replace <…> with your own values

## When to use it
- build a UI hierarchy under the active Canvas from a prompt
- attach Cocos components to scene objects
- run JavaScript in the editor or runtime context
- capture a screenshot to validate the result
- connect an AI client to the editor with one command

## Example prompts
- Create a login screen with account and password fields plus a submit button, then check the hierarchy under Canvas
- Run this script in the scene context and show me the screenshot
- Inspect the current scene and tell me which components sit on the root nodes

## Similar
- [scenes](https://affpapa.org/en/nevibecode/skills/scenes.md) — skill · 950 installs
- [groups-and-containers](https://affpapa.org/en/nevibecode/skills/groups-and-containers.md) — skill · 795 installs
- [phaser-core](https://affpapa.org/en/nevibecode/skills/phaser-core.md) — skill · 5700 installs
- [phaser-arcade-physics](https://affpapa.org/en/nevibecode/skills/phaser-arcade-physics.md) — skill · 5500 installs
- [threejs-game](https://affpapa.org/en/nevibecode/skills/threejs-game.md) — skill · 1100 installs
- [add-feature](https://affpapa.org/en/nevibecode/skills/add-feature.md) — skill · 977 installs

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md