Panduan Instalasi Cocos Creator 3.x MCP: Impor Ekstensi dan Hubungkan AI IDE

Apa yang Dicakup Panduan Ini

Ikuti lima langkah berikut untuk menghubungkan Cocos Creator 3.x MCP (VberAI Pro) ke proyek Creator lokal sehingga Cursor (atau AI IDE lain yang mendukung MCP—konsepnya sama) dapat mengoperasikan, mempratinjau, dan men-debug editor—bukan hanya mengedit skrip di disk.

Setelah selesai, Anda akan dapat:

• Mengimpor dan mengaktifkan cocos-mcp-server melalui Extension Manager
• Mengaktifkan dengan akun VberAI atau email + kode aktivasi
• Memulai Cocos MCP Server lokal (port default 3000)
• Menggunakan Quick configure → Auto configure untuk mendaftarkan server di Cursor dan mengonfirmasi koneksi

Halaman produk: VberAI Cocos MCP 3.x

Artikel ini menggunakan Cursor sebagai contoh. Claude Code, Windsurf, Cline, dan klien MCP lainnya mengikuti alur yang serupa.

Prasyarat

Item	Catatan
Cocos Creator	3.0+ (proyek 3.x apa pun)
Paket plugin	Arsip Cocos Creator 3.x MCP Pro dari situs resmi
Aktivasi	Akun VberAI + kata sandi, atau email + kode aktivasi
AI IDE	Cursor direkomendasikan; klien MCP lain juga berfungsi
Jaringan lokal	Jembatan MCP biasanya berjalan di 127.0.0.1—jangan ekspos port ke publik

Langkah 1: Unduh Cocos Creator 3.x MCP

Unduh build Pro dari situs VberAI:

Halaman unduhan: https://www.vberai.com/game-engines/cocos?ch=CQZLC2FG

Alur yang disarankan:

1. Buka halaman dan unduh Cocos MCP 3.x Pro dengan izin akun Anda
2. Simpan arsip secara lokal—Anda tidak perlu mengekstraknya ke proyek dulu (langkah berikutnya mengimpor arsip)
3. Pastikan proyek adalah Creator 3.0 atau lebih baru; jangan campur dengan paket 2.x

Perbedaan OSS vs Pro dan penagihan mengikuti salinan situs saat ini.

Langkah 2: Impor Ekstensi

1. Buka proyek Cocos Creator 3.x Anda
2. Menu: Extension → Extension Manager → Import Extension
3. Pilih arsip Cocos Creator 3.x MCP yang baru Anda unduh
4. Setelah impor berhasil, daftar ekstensi akan menampilkan cocos-mcp-server enabled

Jika tampak dinonaktifkan, aktifkan sebelum melanjutkan.

Langkah 3: Aktifkan cocos-mcp-server

1. Menu: Extension → Cocos MCP Server → Open Mcp Panel
2. Pada layar aktivasi, gunakan salah satu:
   • Akun VberAI + kata sandi
   • Email + kode aktivasi
3. Setelah aktivasi berhasil, buka halaman pengaturan MCP Server (langkah berikutnya)

Tanpa aktivasi, server biasanya tidak akan berjalan. Pastikan paket atau kode Anda cocok dengan build Pro saat ini.

Langkah 4: Mulai cocos-mcp-server

1. Setelah aktivasi, buka pengaturan MCP Server
2. Sesuaikan sesuai kebutuhan:
   • Port: default 3000
   • Bahasa: sesuaikan dengan preferensi UI Anda
   • Startup: gunakan opsi panel (misalnya mulai otomatis dengan editor, jika tersedia)
3. Klik Start service
4. Saat panel menampilkan Running, Cocos MCP Server aktif

Anda sekarang memiliki jembatan MCP lokal. Selanjutnya, serahkan ke AI IDE Anda.

Langkah 5: Pengaturan AI IDE Sekali Klik (Contoh Cursor)

1. Buka Tool manager
   • Tinjau alat yang diekspos oleh Cocos MCP Server
   • Aktifkan hanya yang ingin Anda gunakan AI
2. Buka Quick configure
   • Pilih IDE Anda (misalnya Cursor)
   • Klik Auto configure
   • Konfirmasi UI menampilkan status configured
3. Buka Cursor
   • Di daftar MCP / alat, Anda akan melihat cocos-creator (atau nama yang ditampilkan di panel) terhubung
   • Jika tidak ada, klik Reload (atau muat ulang MCP yang setara) di Cursor dan periksa lagi

IDE lain mengikuti jalur yang sama—cukup pilih klien yang berbeda di Quick configure.

Verifikasi cepat setelah terhubung

Di Cursor, mulailah dengan pemeriksaan hanya-baca, misalnya:

Daftarkan node root dari scene yang sedang terbuka di Cocos Creator.

Jika jawaban sesuai dengan hierarki editor, jembatan berfungsi. Kemudian coba penulisan kecil (buat node sementara dan hapus) untuk mengonfirmasi izin dan pemilihan alat.

FAQ

Impor gagal, atau cocos-mcp-server tidak ada di daftar?
Gunakan arsip 3.x resmi (bukan 2.x). Creator harus 3.0+. Jika tetap dinonaktifkan, aktifkan di Extension Manager dan mulai ulang Creator.

Aktivasi terus gagal?
Konfirmasi hak Pro, atau bahwa kode aktivasi valid dan terikat ke email yang benar. Periksa pusat akun di situs, lalu coba lagi di panel.

Saya klik Start service tetapi tidak pernah melihat Running?
Pastikan port 3000 (atau port khusus Anda) bebas, dan localhost tidak diblokir. Pastikan Langkah 3 berhasil diselesaikan.

Cursor tidak menampilkan cocos-creator?
Di Creator, pastikan server masih Running, jalankan Quick configure → Auto configure lagi, lalu muat ulang MCP di Cursor. Jika masih gagal, periksa bahwa konfigurasi MCP Cursor menyertakan alamat jembatan lokal.

Langkah Berikutnya

• Gunakan bahasa alami untuk kueri scene atau edit kecil untuk mempelajari batas alat
• Lakukan commit sebelum perubahan besar; jaga jembatan hanya di localhost
• Untuk UI desain-ke-engine, pasangkan dengan VberAI Studio, lalu iterasi di editor dengan MCP

Untuk Creator 2.x, ikuti panduan instalasi Cocos Creator 2.x MCP—jangan campur paket. Untuk memperjelas batas kemampuan dan bedanya dari “Cocos Creator AI” yang kabur, lihat Apa itu Cocos Creator MCP. Untuk konteks MCP lebih lanjut, lihat panduan video Cocos Creator MCP.