用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/theyoungastronauts/polaris --skill visual-feedback命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
正在显示 SKILL.md
| name | visual-feedback |
| description | Browser-annotated UI-fix workflow via the Agentation MCP. |
| disable-model-invocation | true |
Use browser annotations to drive frontend fixes. Humans mark up the live page, Claude picks up annotations via MCP and resolves them — no copy-paste, no describing UI bugs in words.
npm install agentation -D
React / Next.js — in your root layout (e.g., src/app/layout.tsx):
import { Agentation } from "agentation";
// Inside <body>, after your content:
{process.env.NODE_ENV === "development" && <Agentation />}
Astro — create a React island wrapper:
// src/components/dev/AgentationOverlay.tsx
import { Agentation } from "agentation";
export default function AgentationOverlay() {
return <Agentation />;
}
Then include in your base layout (e.g., src/layouts/BaseLayout.astro):
---
import AgentationOverlay from '@/components/dev/AgentationOverlay.tsx';
---
<!-- Inside <body>, after <Footer /> -->
{import.meta.env.DEV && <AgentationOverlay client:only="react" />}
Astro requires @astrojs/react, react, and react-dom as dependencies.
Option A — project .mcp.json (recommended, shared with team):
{
"mcpServers": {
"agentation": {
"command": "npx",
"args": ["agentation-mcp", "server"]
}
}
}
Option B — per-user CLI:
claude mcp add agentation -- npx agentation-mcp server
npx agentation-mcp doctor
The browser toolbar connects to an HTTP server (port 4747 default), which feeds annotations to Claude via MCP stdio.
| Tool | Purpose |
|---|---|
agentation_list_sessions | List active annotation sessions |
agentation_get_session | Get annotations for a session |
agentation_get_pending | Pending annotations for a session |
agentation_get_all_pending | All pending across sessions |
agentation_acknowledge | Mark annotation as seen |
agentation_resolve | Mark annotation as fixed |
agentation_dismiss | Dismiss an annotation |
agentation_reply | Reply to an annotation thread |
agentation_watch_annotations | Block until new annotations arrive |
Use agentation_watch_annotations in a loop to auto-process feedback as it arrives. Good for rapid iteration sessions where the human is continuously reviewing.
Each annotation includes:
fix, change, question, or approveblocking, important, or suggestionblocking annotations before suggestion基于 SOC 职业分类
