ClaudeMap Runtime (bản đồ kiến trúc repo)
Biến một repository thành bản đồ kiến trúc trực quan và điều khiển bản đồ đó trong lúc dẫn giải codebase.
Lập trìnhTrung cấp★ 285⑂ 16Điểm AI 9/10Cập nhật lần cuối: 20 thg 4, 2026
Làm được gì
- Quét project root và tạo snapshot JSON thô bằng
snapshot.js. - Gửi snapshot cho subagent
@claudemap-architectđể nhận về graph JSON chi tiết, nhóm theo hệ thống dễ hiểu với người đọc. - Render graph trong ứng dụng ClaudeMap (Vite) đi kèm skill, và cập nhật khi code thay đổi qua
/refresh. - Hỗ trợ bản đồ theo phạm vi con (
/create-map), dẫn giải từng bước (/explain) và điều khiển trình chiếu/highlight (/show). - Có quy tắc dừng rõ ràng: nếu subagent thất bại thì không âm thầm dựng graph heuristic, tránh làm bẩn cache.
Dành cho ai
- Lập trình viên mới nhận một repo lớn và cần hiểu tổng thể cấu trúc nhanh.
- Team lead cần trình bày kiến trúc khi onboarding người mới hoặc review thiết kế.
- Kiến trúc sư muốn so sánh ranh giới hệ thống trước/sau refactor.
Ví dụ sử dụng
/setup-claudemap ~/work/my-api— dựng bản đồ kiến trúc lần đầu và mở UI./create-map chỉ phần thanh toán— tách riêng subsystem thanh toán và phân rã chi tiết bên trong.- Chạy
/refreshrồi/explain— cập nhật graph theo diff code và được dẫn giải luồng xử lý theo từng bước trên bản đồ.
· · · Hướng dẫn cài đặt · · ·
Dùng thử ngay, không cần cài
Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.
Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình: https://raw.githubusercontent.com/QuinnAho/claudemap/HEAD/skill/SKILL.md Mình muốn: (viết việc bạn cần ở đây)
Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.
↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.
Cài vào ứng dụng Claude (không cần terminal)
- Tải tệp ZIP bằng nút bên dưới.
- Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
- Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
Cài vào Claude Code
Để Claude làm — dán câu dưới đây vào Claude Code
Hãy cài skill mình tìm thấy trên Claude Skill Mart. Copy thư mục skill từ repo GitHub QuinnAho/claudemap vào ~/.claude/skills/claudemap-runtime/ của mình. Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.
Cài bằng lệnh thủ công
git clone https://github.com/QuinnAho/claudemap.git ~/.claude/skills/claudemap⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.
- Kiểm tra Node.js đã cài (
node -v); nên dùng Node 18+ vì UI dùng Vite. - Tạo thư mục skills:
mkdir -p ~/.claude/skills - Clone toàn bộ repo:
git clone https://github.com/QuinnAho/claudemap.git ~/.claude/skills/claudemap- Chỉ copy SKILL.md sẽ không chạy: cần cả
skill/commands/*.js,skill/prompts/*và thư mụcapp/.
- Chỉ copy SKILL.md sẽ không chạy: cần cả
- Copy kèm
.claude/agents/claudemap-architect.mdvà các file trong.claude/commands/theo hướng dẫn README. - Cài dependency:
cd ~/.claude/skills/claudemap && npm install - Khởi động lại Claude Code, mở project cần phân tích và chạy
/setup-claudemap. - Khi bản đồ hiện ra, trả lời câu hỏi xác nhận để yêu cầu tinh chỉnh graph.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT