Playcanvas Editor MCP Server

🚀 MCP サーバー：PlayCanvas エディターを自動化する大規模言語モデル駆動ツール

MCP サーバーは、PlayCanvas エディターの自動化を実現する大規模言語モデル駆動のツールです。このツールを使用することで、PlayCanvas エディター内の様々な操作を自動化することができます。

⚠️ 重要提示

現在、MCP サーバーは Anthropic の Claude によって駆動される必要があります。Claude の無料版はコンテキストウィンドウが小さく（約 4k tokens）、複雑な PlayCanvas プロジェクトを処理するには不十分な場合があります。そのため、Claude Pro アカウントの使用を強くおすすめします。

🚀 クイックスタート

このセクションでは、MCP サーバーの基本的な使い方を説明します。まずは、MCP サーバーの概要を理解し、その後にインストール方法や使用例を紹介します。

✨ 主な機能

MCP サーバーは、PlayCanvas エディター内の様々な操作を自動化するための多くの機能を提供します。以下は、利用可能な主なコマンドのリストです。

1. エンティティの作成：create_entities
2. すべてのエンティティの削除：delete_all_entities
3. マテリアル属性の変更：modify_material_properties
4. メッシュのスケール調整：adjust_mesh_scale
5. 変換行列の設定：set_transform_matrix
6. 剛体ダイナミクスの追加：add_rigidbody_dynamics
7. 選択されたオブジェクトの削除：delete_selected_objects
8. シーンを JSON 形式でエクスポート：export_scene_to_json
9. 外部モデルのインポート：import_external_model
10. すべての変換のリセット：reset_all_transforms
11. 衝突検出の有効化：enable_collision_detection
12. パーティクルシステムの無効化：disable_particle_system
13. 光源強度の変更：modify_light_intensity
14. スクリプトコンポーネントの追加：add_script_component
15. マテリアル参照の削除：delete_material_references
16. 空のオブジェクトの作成：create_empty_object
17. 選択されたオブジェクトのクローン：clone_selected_object
18. 模方グラスメッシュの適用：apply_m模具_glass
19. モデル形式の変換：convert_model_format
20. 現在のシーンの保存：save_current_scene

📦 インストール

ステップ 1：MCP サーバーのインストール

ターミナルで以下のコマンドを実行して、MCP サーバーをインストールします。

npm install

ステップ 2：Chrome 拡張機能のインストール

mcp-editor/dist/mcp_editor.zip ファイルを解凍し、ブラウザの拡張機能としてインストールします。

📚 ドキュメント

MCP サーバーの設定

使用するオペレーティングシステムに応じて、設定ファイルは次のようになります。

Windows システム：

{
  "mcpServers": {
    "playcanvas": {
      "command": "cmd",
      "args": [
        "/c",
        "npx",
        "tsx",
        "C:\\路径\\到\\mcp-editor\\src\\server.ts"
      ]
    }
  }
}

macOS システム：

{
  "mcpServers": {
    "playcanvas": {
      "command": "npx",
      "args": [
        "tsx",
        "/路径/到/mcp-editor/src/server.ts"
      ]
    }
  }
}

MCP サーバーの駆動方法

方法 1：Claude Desktop を使用する

1. Claude Desktop をインストールします。
2. Claude の設定を開き、mcp.json ファイルを見つけて次のように設定します。

{
  "mcpServers": {
    "playcanvas": {
      "command": "npx",
      "args": [
        "tsx",
        "/路径/到/mcp-editor/src/server.ts"
      ]
    }
  }
}

方法 2：Cursor を使用する

1. Cursor をインストールします。
2. 設定を開き、File > Preferences > Cursor Settings に移動します。
3. + 新しいグローバル MCP サーバーを追加 をクリックし、次のように設定します。

{
  "mcpServers": {
    "playcanvas": {
      "command": "npx",
      "args": [
        "tsx",
        "/路径/到/mcp-editor/src/server.ts"
      ]
    }
  }
}

🔧 注意事項

1. Claude Pro の使用を推奨：Claude の無料版はコンテキストウィンドウが小さく（約 4k tokens）、PlayCanvas プロジェクトのニーズを満たせない場合があります。Claude Pro にアップグレードすることをおすすめします。
2. 自動実行モードの有効化：
   • Cursor の設定で Features セクションに移動し、Enable auto-run mode を有効にして、LLM が MCP ツールを自動で実行できるようにします。
   • 注意：この機能にはリスクがあるため、慎重に使用してください。
3. 適切な代理モードの選択：
   • Cursor では、Agent モードを選択してください。Ask および Edit モードでは MCP サーバーのコマンドを認識できません。

以上の手順に従うことで、MCP サーバーを正常に設定し、PlayCanvas エディターの自動化操作を実現することができます！