Agentation 代码验证
- 作者仓库星标 3,717
- 作者仓库 agentation
Agentation Setup
Set up the Agentation annotation toolbar in this project.
Steps
Check if already installed
- Look for
agentationin package.json dependencies - If not found, run
npm install agentation(or pnpm/yarn based on lockfile)
- Look for
Check if already configured
- Search for
<Agentationorimport { Agentation }in src/ or app/ - If found, report that Agentation is already set up and exit
- Search for
Detect framework
- Next.js App Router: has
app/layout.tsxorapp/layout.js - Next.js Pages Router: has
pages/_app.tsxorpages/_app.js
- Next.js App Router: has
Add the component
For Next.js App Router, add to the root layout:
import { Agentation } from "agentation"; // Add inside the body, after children: {process.env.NODE_ENV === "development" && <Agentation />}For Next.js Pages Router, add to _app:
import { Agentation } from "agentation"; // Add after Component: {process.env.NODE_ENV === "development" && <Agentation />}Confirm component setup
- Tell the user the Agentation toolbar component is configured
Recommend MCP server setup
- Explain that for real-time annotation syncing with AI agents, they should also set up the MCP server
- Recommend one of the following approaches:
- Universal (supports 9+ agents including Claude Code, Cursor, Codex, Windsurf, etc.):
See add-mcp — run
npx add-mcpand follow the prompts to addagentation-mcpas an MCP server - Claude Code only (interactive wizard):
Run
agentation-mcp initafter installing the package
- Universal (supports 9+ agents including Claude Code, Cursor, Codex, Windsurf, etc.):
See add-mcp — run
- Tell user to restart their coding agent after MCP setup to load the server
- Explain that once configured, annotations will sync to the agent automatically
Notes
- The
NODE_ENVcheck ensures Agentation only loads in development - Agentation requires React 18
- The MCP server runs on port 4747 by default for the HTTP server
- MCP server exposes tools like
agentation_get_all_pending,agentation_resolve, andagentation_watch_annotations - Run
agentation-mcp doctorto verify setup after installing
- 流狐分类
- AI 智能
- 作者声明 Agent
- 未找到明确声明;不据此推断已兼容或已测试
- 静态检查
- 88 / 100 · 启发式扫描,不代表运行安全
- 作者 / 版本 / 许可
- @benjitaylor · 未声明 license
- 流狐 Token 估算
- 低消耗
- 流狐接入估算
- 即装即用
- 是否需要外部 API Key
- 未发现要求
- 检测到的系统要求
- macOS · Linux · Windows
- 底层运行要求
- 未声明
- 检测到的文件与系统行为
-
- 只读
- 允许写入 / 修改
- 读取环境变量
- 检测到的网络行为
- 仅限本地
- 安装命令数
- 无(仅作为资料)
档案由构建时根据 SKILL.md 与安装命令自动衍生,可能与作者实际意图存在差异。
需要注意: 未限定 allowed-tools,默认拥有全部工具权限。
作者没有在当前 SKILL.md 中定义固定输出样例。 Steps
Check if already installed Look for agentation in package.json dependencies If not found, run npm install agentation (or pnpm/yarn based on lockfile)
Notes
The NODEENV check ensures Agentation only loads in development Agentation requires React 18 The MCP server runs on port 4747 by default for the HTTP server
# Agentation Setup
Set up the Agentation annotation toolbar in this project.
## Steps
1. **Check if already installed**
- Look for `agentation` in package.json dependencies
- If not found, run `npm install agentation` (or pnpm/yarn based on lockfile)
2. **Check if already configured**
- Search for `<Agentation` or `import { Agentation }` in src/ or app/
- If found, report that Agentation is already set up and exit
3. **Detect framework**
- Next.js App Router: has `app/layout.tsx` or `app/layout.js`
- Next.js Pages Router: has `pages/_app.tsx` or `pages/_app.js`
4. **Add the component**
For Next.js App Router, add to the root layout:
```tsx
import { Agentation } from "agentation";
// Add inside the body, after children:
{process.env.NODE_ENV === "development" && <Agentation />}
```
For Next.js Pages Router, add to _app:
```tsx
import { Agentation } from "agentation";
// Add after Component:
{process.env.NODE_ENV === "development" && <Agentation />}
```
5. **Confirm component setup**
- Tell the user the Agentation toolbar component is configured
6. **Recommend MCP server setup**
- Explain that for real-time annotation syncing with AI agents, they should also set up the MCP server
- Recommend one of the following approaches:
- **Universal (supports 9+ agents including Claude Code, Cursor, Codex, Windsurf, etc.):**
See [add-mcp](https://github.com/neondatabase/add-mcp) — run `npx add-mcp` and follow the prompts to add `agentation-mcp` as an MCP server
- **Claude Code only (interactive wizard):**
Run `agentation-mcp init` after installing the package
- Tell user to restart their coding agent after MCP setup to load the server
… 证据边界与执行链路
作者原文负责流程事实;流狐只索引当前章节、要点、文件与命令。
章节 -> Steps → Notes
要点 -> Check if already installed · Check if already configured · Detect framework · Add the component · Confirm component setup · Recommend MCP server setup · Claude Code only (interactive wizard)
文件/命令 -> agentation · npm install agentation · <Agentation · import { Agentation } · app/layout.tsx · app/layout.js · pages/app.tsx · pages/app.js
内容 SHA-256 -> 8f232ddbe1e3
方法与流程
适用与边界
原文中的明确线索
agentation、npm install agentation、<Agentation、import { Agentation }、app/layout.tsx、app/layout.js、pages/app.tsx、pages/app.js