Chuyển tới nội dung

Pro đang mở bán trước. Cài đặt mở từ tháng 1/2027. Xem Pro

Tài liệu

AI agent và MCP

Werewolf được làm để dùng qua agent code. Agent của bạn có ba thứ: luật để đọc trước khi viết UI, MCP server để tra component và token, và linter để tự kiểm tra code.

Luật agent đọc

npx werewolf-ui init luôn ghi AGENTS.md (một phần do CLI quản lý, giữa <!-- werewolf:start --> và <!-- werewolf:end -->) và .agents/skills/werewolf-design/SKILL.md, tức design skill. Lệnh thêm file riêng của từng agent được chọn. Không có --agent, init giữ luật của Cursor và thêm mọi agent nó nhận ra từ môi trường hoặc file trong dự án.

npx werewolf-ui init --agent claude,copilot
`--agent`File ngoài `AGENTS.md` và skill
claudeA block with @AGENTS.md in CLAUDE.md, and .claude/skills/werewolf-design/SKILL.md
cursor.cursor/rules/werewolf.mdc
copilot.github/instructions/werewolf.instructions.md
windsurf.windsurf/rules/werewolf.md (or .devin/rules/werewolf.md when .devin/ exists)
geminiA block with @./AGENTS.md in GEMINI.md
cline.clinerules/werewolf.md
codex, jules, amp, otherNone: they read AGENTS.md

Nội dung của bạn quanh phần do CLI quản lý được giữ nguyên. Init không bao giờ xóa file của agent bạn không chọn.

Để agent tự cài

Dán prompt này vào agent khi đang ở thư mục app. Prompt yêu cầu agent chạy init với id của chính nó và dừng lại khi có xung đột thay vì ghi đè file của bạn.

Run `npx werewolf-ui@latest init --agent <id> --yes --json`. Use your tool's id: cursor, claude, copilot, windsurf, gemini, cline, or other (Codex and anything else). Don't add --overwrite. If there's a conflict, stop and show me. Then tell me which files were created, updated or unchanged.

Kết nối MCP server

Thêm cấu hình tiến trình này vào phần MCP của client và thay /absolute/path/to/app bằng thư mục app. Phiên bản được ghim chính xác để client không tự tải bản mới mà bạn chưa xem. Client cần Node 20+ và npx trên PATH.

{
  "command": "npx",
  "args": [
    "--yes",
    "werewolf-ui@0.1.0-alpha.1",
    "mcp",
    "--cwd",
    "/absolute/path/to/app"
  ]
}

Lần chạy đầu tải package; sau đó catalog trong package dùng được offline, không cần dịch vụ online hay API key. Thư mục nào đã tồn tại cũng được, init không bắt buộc. Stdout chỉ dành cho giao thức, nên đừng chuyển stderr vào đó.

Năm công cụ

Mọi công cụ đều chỉ đọc. MCP không cài component, sửa file hay ghi theme: agent dùng CLI cho những việc đó.

Công cụVí dụ tham sốTrả về
list_components{"status":"draft","limit":10}Tóm tắt component kèm trạng thái API, có phân trang
search{"query":"button","kind":"component"}Component, token hoặc luật, xếp theo độ khớp
get_component{"name":"button"}Spec, mã nguồn, ví dụ, cách dùng, dependency và lệnh cài
generate_theme{"seed":{"radius-base":"round"}}Bảng token tối và sáng cùng kết quả kiểm tra tương phản cho một seed
lint{"paths":["src/App.tsx"]}Lỗi style và phạm vi đã kiểm tra

Tài liệu dạng Markdown

Mọi trang của site đều có bản Markdown: thêm .md vào đường dẫn, ví dụ /docs/installation.md hoặc /vi/docs/installation.md. llms.txt liệt kê mọi trang docs và component kèm link Markdown. Nút Copy trang trên header docs copy trang bạn đang đọc.

Kiểm tra code agent viết

Bảo agent chạy lint sau mỗi lần sửa UI và sửa những gì lint báo. Với --json, agent đọc một bản kết quả duy nhất; --fix --yes chỉ áp dụng chỉnh sửa mà linter chứng minh được. Xem data.coverage: style động mà lint không đọc được là cảnh báo, không phải đã đạt.

npx werewolf-ui lint src --json
npx werewolf-ui lint src --fix --yes --json