← Kembali ke blog

Cara Menyediakan Cocos Creator MCP dengan Cursor dan Claude (Tutorial Video)

Sambungkan Cocos Creator MCP ke Cursor atau Claude: pasang plugin, konfigurasikan Model Context Protocol, dan sahkan AI boleh mengawal editor.

Diterbitkan
  • cocos
  • cocos-creator
  • mcp
  • cursor
  • claude
  • tutorial
  • video
Tonton di YouTube

Tonton Tutorial Video

Video: Panduan persediaan Cocos Creator MCP di saluran YouTube VberAI

Rakaman ini adalah panduan konfigurasi Cocos Creator MCP secara hands-on—bukan gambaran keseluruhan pelbagai enjin. Anda akan melihat cara memasang plugin MCP, memulakan jambatan tempatan, dan menyambungkan klien AI seperti Cursor atau Claude Desktop supaya pembantu boleh membaca dan mengubah projek Cocos Creator anda di dalam editor.

Apa yang Anda Akan Pelajari

Selepas mengikuti video dan senarai semak di bawah, anda sepatutnya dapat:

  • Memasang dan mengaktifkan plugin Cocos Creator MCP untuk Creator 2.x atau 3.x
  • Memulakan pelayan MCP / jambatan tempatan dari panel plugin
  • Menambah pelayan ke Cursor, Claude, Windsurf, atau klien lain yang serasi dengan MCP
  • Menjalankan ujian baca sahaja (pokok scene) dan ujian tulis kecil (cipta atau namakan semula nod)

Model Context Protocol (MCP) mendedahkan keadaan editor secara langsung—scene semasa, hierarki nod, pemilihan—bukan hanya fail pada cakera. Itulah sebabnya persediaan MCP penting untuk aliran kerja permainan.

Prasyarat

ItemNota
Cocos CreatorProjek 2.x atau 3.x dibuka dalam editor
Plugin MCPSambungan Cocos Creator MCP (video menggunakan binaan VberAI Cocos MCP)
Klien AICursor, Claude Desktop, Claude Code, Windsurf, Cline, atau mana-mana pembantu yang menyokong MCP
Akses tempatanJambatan MCP berjalan pada 127.0.0.1; firewall harus membenarkan loopback

Langkah Persediaan (Ikut Serta Dengan Video)

1. Pasang plugin Cocos Creator MCP

  1. Muat turun sambungan MCP untuk versi Creator anda daripada penyedia plugin (lihat Muat turun Cocos MCP).
  2. Import atau salin sambungan ke dalam folder extensions projek anda, atau pasang melalui pengurus sambungan Creator—mengikut spesifikasi dokumen plugin.
  3. Buka Extension → Extension Manager, aktifkan plugin MCP, dan muat semula editor jika diminta.

2. Mulakan jambatan MCP

Buka panel kawalan plugin (nama menu berbeza mengikut binaan—selalunya MCP atau AI Bridge):

  • Klik Start Server / Start MCP
  • Perhatikan URL tempatan dan port yang dipaparkan dalam panel (anda akan tampal ini ke dalam klien AI anda)

Pastikan Cocos Creator berjalan semasa jambatan aktif.

3. Konfigurasikan klien AI anda

Tambah entri pelayan MCP yang menunjuk ke URL jambatan dari langkah 2. Contoh bentuk untuk Cursor (mcp.json):

{
  "mcpServers": {
    "cocos-mcp": {
      "url": "http://127.0.0.1:PORT/mcp"
    }
  }
}

Gantikan PORT dengan nilai dari UI plugin. Banyak binaan Cocos MCP termasuk butang Configure for Cursor / Claude yang menyalin JSON yang betul—gunakan jika ada.

Mulakan semula atau muat semula klien AI selepas menyimpan konfigurasi.

4. Sahkan sambungan

Dalam Cursor atau Claude, tanya soalan baca sahaja dahulu:

  • “Senaraikan pokok nod scene semasa.”
  • “Apakah nod di bawah Canvas?”

Anda sepatutnya mendapat laluan berstruktur dari editor—bukan kandungan fail yang diagak.

5. Cuba satu operasi tulis kecil

Arahan perubahan yang boleh diterbalikkan:

  • Cipta nod anak kosong di bawah pemilihan
  • Namakan semula kumpulan UI yang tidak dinamik dengan baik
  • Lampirkan komponen atau skrip stub

Sahkan perubahan muncul dalam panel Hierarchy sebelum menjalankan tugas automasi yang lebih besar.

Mengapa MCP Lebih Baik Daripada AI Coding Berasaskan Fail Sahaja

Tanpa MCP, pembantu hanya melihat fail pada cakera. Mereka terlepas:

  • Perubahan scene yang belum disimpan dan pemilihan semasa
  • Sifat nod dan nilai komponen secara langsung
  • Konteks khusus editor (mod prefab, tetapan binaan, dll.)

MCP menghantar kebenaran editor kepada model, yang merupakan titik persediaan Cocos Creator MCP. Untuk penerokaan bertulis yang mendalam tentang seni bina jambatan yang serupa, lihat Cara Kami Membina Pelayan MCP Masa Nyata untuk Godot.

Gabungkan MCP dengan Alat Reka Bentuk-ke-UI (Pilihan)

MCP mengendalikan operasi editor selepas aset wujud. Alat seperti VberAI Studio (AI Studio) mengendalikan PSD / Figma → struktur UI enjin untuk Unity, Godot, atau Cocos. Stok biasa:

  1. AI Studio mengimport skrin berlapis dan mengeksport prefab / susun atur nod Cocos
  2. Cocos MCP menyambungkan butang, menamakan semula nod, dan mengesahkan rujukan dalam Creator

Lihat juga: Bina UI Permainan dalam 3 Minit dengan AI Studio.

Soalan Lazim

Bagaimana saya menyambungkan Cursor ke Cocos Creator?
Pasang Cocos Creator MCP, mulakan jambatan tempatan dalam editor, tambah URL jambatan ke mcp.json Cursor di bawah mcpServers, kemudian uji dengan prompt pokok scene.

Apakah itu Cocos Creator MCP?
Plugin Model Context Protocol yang membolehkan klien AI membaca dan mengubah suai projek Cocos Creator melalui editor yang berjalan.

Klien AI mana yang berfungsi dengan Cocos MCP?
Mana-mana klien yang serasi dengan MCP: Cursor, Claude Desktop, Claude Code, Windsurf, Cline, dan lain-lain.

Adakah video ini merangkumi Unity atau Godot?
Tidak—rakaman ini hanya memberi tumpuan kepada konfigurasi Cocos Creator MCP. Untuk Unity, lihat panduan pemasangan Unity MCP; untuk Godot, lihat Godot MCP vs skrip manual.

Di manakah video rasmi?
YouTube: Persediaan Cocos Creator MCP, saluran @vber_ai. Langgan saluran YouTube VberAI untuk lebih banyak tutorial MCP.

Panduan lain yang mungkin anda suka