Community生产力与协作github.com

vercel-labs/next-browser

一个CLI工具,为AI代理提供与人类通过React DevTools和Next.js开发覆盖层相同的信息——组件树、属性、钩子、PPR外壳、错误、网络——以返回结构化文本的shell命令形式呈现。

next-browser 是什么?

vercel-labs/next-browser 是一个专为AI代理(如Claude Code、Cursor、Codex)设计的命令行工具,它将React DevTools和Next.js开发覆盖层(dev overlay)中的功能抽象为可执行的shell命令。通过这个工具,代理可以获取组件树(component trees)、组件属性(props)、钩子状态(hooks)、Partial Prerendering(PPR)外壳、错误信息和网络请求等结构化文本输出。这解决了AI代理无法直接访问浏览器开发者工具或耗尽人类视觉识别问题的问题。目前支持Node.js环境,通过npm或pnpm全局安装后,可在Next.js项目中直接运行。其工作原理是在后台启动一个本地服务器,连接到Next.js开发服务器,提取实时调试信息,并通过标准输出返回格式化的JSON或纯文本,便于代理解析和进一步操作。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vercel-labs/next-browser/tree/main/skills/next-browser

Installed? Explore more 生产力与协作 skills: steipete/gemini, steipete/gh-issues, steipete/skill-creator · View all 6 →

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

next-browser 是做什么的?

一个CLI工具,为AI代理提供与人类通过React DevTools和Next.js开发覆盖层相同的信息——组件树、属性、钩子、PPR外壳、错误、网络——以返回结构化文本的shell命令形式呈现。

相关技能