Cách Thiết Lập Cocos Creator MCP với Cursor và Claude (Video Hướng Dẫn)

Xem Video Hướng Dẫn

Video: Hướng dẫn thiết lập Cocos Creator MCP trên kênh YouTube VberAI

Bản ghi này là hướng dẫn cấu hình Cocos Creator MCP thực hành—không phải tổng quan đa công cụ. Bạn sẽ thấy cách cài plugin MCP, khởi động cầu nối cục bộ, và kết nối một ứng dụng AI như Cursor hoặc Claude Desktop để trợ lý có thể đọc và thay đổi dự án Cocos Creator của bạn trong trình biên tập.

Những Gì Bạn Sẽ Học

Sau khi xem video và danh sách kiểm tra dưới đây, bạn sẽ có thể:

• Cài đặt và kích hoạt plugin Cocos Creator MCP cho Creator 2.x hoặc 3.x
• Khởi động máy chủ / cầu nối MCP cục bộ từ bảng điều khiển plugin
• Thêm máy chủ vào Cursor, Claude, Windsurf, hoặc một ứng dụng tương thích MCP khác
• Chạy thử nghiệm chỉ đọc (cây cảnh) và một thử nghiệm ghi nhỏ (tạo hoặc đổi tên một nút)

Model Context Protocol (MCP) hiển thị trạng thái trình biên tập trực tiếp—cảnh hiện tại, hệ thống phân cấp nút, lựa chọn—không chỉ các tệp trên đĩa. Đó là lý do tại sao việc thiết lập MCP quan trọng đối với quy trình làm việc trò chơi.

Điều Kiện Tiên Quyết

Mục	Ghi chú
Cocos Creator	Dự án 2.x hoặc 3.x đang mở trong trình biên tập
Plugin MCP	Tiện ích mở rộng Cocos Creator MCP (video sử dụng bản dựng VberAI Cocos MCP)
Ứng dụng AI	Cursor, Claude Desktop, Claude Code, Windsurf, Cline, hoặc bất kỳ trợ lý nào hỗ trợ MCP
Truy cập cục bộ	Cầu nối MCP chạy trên 127.0.0.1; tường lửa nên cho phép loopback

Các Bước Thiết Lập (Theo Dõi Cùng Video)

1. Cài Đặt Plugin Cocos Creator MCP

1. Tải tiện ích mở rộng MCP cho phiên bản Creator của bạn từ nhà cung cấp plugin (xem Tải xuống Cocos MCP).
2. Nhập hoặc sao chép tiện ích mở rộng vào thư mục extensions của dự án, hoặc cài đặt qua trình quản lý tiện ích mở rộng của Creator—tùy theo tài liệu plugin chỉ định.
3. Mở Extension → Extension Manager, kích hoạt plugin MCP, và tải lại trình biên tập nếu được nhắc.

2. Khởi Động Cầu Nối MCP

Mở bảng điều khiển của plugin (tên menu thay đổi tùy theo bản dựng—thường là MCP hoặc AI Bridge):

• Nhấp Start Server / Start MCP
• Ghi chú URL cục bộ và cổng hiển thị trong bảng (bạn sẽ dán cái này vào ứng dụng AI của mình)

Giữ Cocos Creator chạy trong khi cầu nối hoạt động.

3. Cấu Hình Ứng Dụng AI Của Bạn

Thêm một mục máy chủ MCP trỏ đến URL cầu nối từ bước 2. Ví dụ về hình dạng cho Cursor (mcp.json):

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

Thay thế PORT bằng giá trị từ giao diện plugin. Nhiều bản dựng Cocos MCP bao gồm nút Configure for Cursor / Claude sao chép JSON chính xác—sử dụng khi có sẵn.

Khởi động lại hoặc tải lại ứng dụng AI sau khi lưu cấu hình.

4. Xác Minh Kết Nối

Trong Cursor hoặc Claude, hãy hỏi một câu hỏi chỉ đọc trước:

• “Liệt kê cây nút cảnh hiện tại.”
• “Có những nút nào dưới Canvas?”

Bạn sẽ nhận được các đường dẫn có cấu trúc từ trình biên tập—không phải nội dung tệp đoán.

5. Thử Một Thao Tác Ghi Nhỏ

Yêu cầu một thay đổi có thể hoàn tác:

• Tạo một nút con trống dưới lựa chọn
• Đổi tên một nhóm UI được đặt tên kém
• Đính kèm một thành phần hoặc tập lệnh giả

Xác nhận thay đổi xuất hiện trong bảng Hierarchy trước khi chạy các tác vụ tự động hóa lớn hơn.

Tại Sao MCP Vượt Trội Hơn AI Mã Hóa Chỉ Dựa Trên Tệp

Không có MCP, trợ lý chỉ thấy các tệp trên đĩa. Họ bỏ lỡ:

• Thay đổi cảnh chưa lưu và lựa chọn hiện tại
• Thuộc tính nút trực tiếp và giá trị thành phần
• Ngữ cảnh chỉ có trong trình biên tập (chế độ prefab, cài đặt build, v.v.)

MCP gửi sự thật trình biên tập đến mô hình, đó là điểm của việc thiết lập Cocos Creator MCP. Để có bài viết chuyên sâu về kiến trúc cầu nối tương tự, xem Cách Chúng Tôi Xây Dựng Máy Chủ MCP Thời Gian Thực Cho Godot.

Kết Hợp MCP Với Công Cụ Thiết Kế Đến UI (Tùy Chọn)

MCP xử lý các thao tác trình biên tập sau khi tài nguyên tồn tại. Các công cụ như VberAI Studio (AI Studio) xử lý PSD / Figma → cấu trúc UI engine cho Unity, Godot, hoặc Cocos. Một quy trình phổ biến:

1. AI Studio nhập một màn hình phân lớp và xuất bố cục prefab / nút Cocos
2. Cocos MCP kết nối các nút, đổi tên nút, và xác thực tham chiếu trong Creator

Xem thêm: Xây Dựng Game UI Trong 3 Phút Với AI Studio.

Câu Hỏi Thường Gặp

Làm thế nào để kết nối Cursor với Cocos Creator?
Cài đặt Cocos Creator MCP, khởi động cầu nối cục bộ trong trình biên tập, thêm URL cầu nối vào mcp.json của Cursor dưới mcpServers, sau đó kiểm tra bằng một lời nhắc cây cảnh.

Cocos Creator MCP là gì?
Một plugin Model Context Protocol cho phép các ứng dụng AI đọc và sửa đổi các dự án Cocos Creator thông qua trình biên tập đang chạy.

Những ứng dụng AI nào hoạt động với Cocos MCP?
Bất kỳ ứng dụng tương thích MCP nào: Cursor, Claude Desktop, Claude Code, Windsurf, Cline, và các ứng dụng khác.

Video có bao gồm Unity hoặc Godot không?
Không—bản ghi này chỉ tập trung vào cấu hình Cocos Creator MCP. Đối với Unity, xem Hướng dẫn cài đặt Unity MCP; đối với Godot, xem Godot MCP so với viết kịch bản thủ công.

Video chính thức ở đâu?
YouTube: Thiết lập Cocos Creator MCP, kênh @vber_ai. Đăng ký kênh YouTube VberAI để xem thêm hướng dẫn MCP.