Cocos Creator 2.x MCP インストール手順：packages に入れて AI IDE に接続

このガイドでできること

次の 5 ステップで Cocos Creator 2.x MCP（VberAI Pro）をローカルの Creator 2.x プロジェクトに接続し、Cursor（または他の MCP 対応 AI IDE。手順は同趣旨）からエディタを操作・プレビュー・デバッグできるようにします。

完了後にできること：

• プラグインを展開してプロジェクトの packages に配置する
• Creator を再起動し、VberAI アカウントまたはメール＋コードで有効化する
• ローカルの Cocos MCP Server を起動する
• クイック設定 → 自動設定 で Cursor に登録し、接続を確認する

製品ページ：VberAI Cocos MCP 2.x

本稿は Cursor を例にします。Claude Code、Windsurf、Cline なども流れは同様です。

前提条件

項目	内容
Cocos Creator	2.4.x+ など 2.x（3.x 用パッケージと混用しない）
プラグイン	公式サイトの Cocos Creator 2.x MCP Pro アーカイブ
有効化	VberAI アカウント＋パスワード、またはメール＋アクティベーションコード
AI IDE	Cursor 推奨。他の MCP クライアントでも可
ローカル通信	橋渡しは通常 127.0.0.1。ポートを公開しないこと

ステップ 1：Cocos Creator 2.x MCP をダウンロード

VberAI 公式サイトから Pro を入手します。

ダウンロードページ： https://www.vberai.com/game-engines/cocos2x?ch=CQZLC2FG

推奨手順：

1. ページを開き、権限に応じて Cocos MCP 2.x Pro をダウンロードする
2. アーカイブをローカルに保存し、展開の準備をする
3. 対象が Creator 2.x であること、3.x MCP 用パッケージと混用しないことを確認する

OSS / Pro の違いと料金は公式の最新説明に従ってください。

ステップ 2：プラグインを導入する（packages へ）

3.x の「拡張管理 → 拡張をインポート」とは異なり、2.x はプロジェクト内配置です。

1. ダウンロードしたアーカイブを本機で展開する
2. 展開したプラグインフォルダを Cocos Creator プロジェクトルートの packages へ移動する
   • packages が無ければ先に作成する
3. レイアウトが packages/<プラグイン名>/ 直下であり、解凍の二重ネストになっていないことを確認する

配置後はすぐ設定せず、Creator を再起動して拡張を読み込みます（次ステップ）。

ステップ 3：cocos-mcp-server を有効化する

1. Cocos Creator を完全に再起動し、プラグイン入りのプロジェクトを開く
2. メニュー 拡張 → MCP Server
3. 有効化画面で次のいずれか：
   • VberAI アカウント＋パスワード
   • メール＋アクティベーションコード
4. 成功後、MCP Server 設定ページへ進む（次ステップ）

未有効化だとサービスは通常起動しません。プランやコードが現行 Pro に対応しているか確認してください。

ステップ 4：cocos-mcp-server を起動する

1. 有効化後、MCP Server 設定 を開く
2. 必要に応じて調整：
   • ポート：パネル既定値またはローカルの取り決め
   • 言語：UI の好みに合わせる
   • 起動：パネルのオプションに従う
3. サービスの起動 をクリック
4. 「実行中」 と表示されたら起動成功です

これでローカル MCP 橋渡しが用意できました。次に AI IDE へ渡します。

ステップ 5：AI IDE を一括設定する（Cursor の例）

1. ツール管理 を開く
   • 公開ツール一覧を確認し、使わせたいものだけをオンにする
2. クイック設定 を開く
   • IDE（例：Cursor）を選ぶ
   • 自動設定 をクリック
   • 設定済み 状態になることを確認する
3. Cursor を開く
   • MCP / ツール一覧に cocos-creator（またはパネル表示名）が接続されているはずです
   • 出ない場合は Cursor で 再読み込み（MCP Reload）して再確認する

他の IDE もクイック設定でクライアントを切り替えるだけです。

接続後の簡単な確認

Cursor ではまず読み取り専用の確認から始めます。例：

現在 Cocos Creator で開いているシーンのルートノードを列挙してください。

Hierarchy と一致すれば橋渡しは正常です。続けて小さな書き込みで権限とツール選択を確認してください。

よくある質問

packages に入れたのに「拡張 → MCP Server」が無い？
Creator を 完全再起動したか確認。packages/<プラグイン名>/ 直下か、解凍の二重ネストがないかを見る。2.x パッケージであることも確認します。

有効化が何度も失敗する？
Pro 権限やコードの有効期限・メール紐付けを公式アカウントで確認してから再試行してください。

起動しても「実行中」にならない？
ポートが空いているか、localhost をブロックしていないかを確認。ステップ 3 の完了も確認します。

Cursor に cocos-creator が出ない？
Creator 側が 実行中 か確認し、クイック設定→自動設定をやり直し、Cursor で MCP を再読み込みします。

次のステップ

• 自然言語でシーン照会や小さな編集を試し、ツールの境界を把握する
• 大きな変更の前にコミットする。橋渡しは localhost のみ
• デザインからエンジン UI は VberAI AI Studio と組み合わせ、その後 MCP で反復する

Creator 3.x は Cocos Creator 3.x MCP インストール手順 を参照し、パッケージを混用しないでください。背景は Cocos Creator MCP 動画ガイド も参照できます。