stagewise

stagewise 是一款面向前端开发者的 AI 辅助工具，形态是挂在浏览器里的工具栏，作用是把网页上看到的界面元素直接交给代码编辑器里的 AI 代理处理。以往改样式要先截图、再打字描述问题，现在点选元素就能把 DOM 结构、截图和元数据一并传过去，由 Cursor、Windsurf 这类代理生成或修改代码。它的核心功能是把“手动喂料”这一步自动化，对经常在浏览器和编辑器之间来回切换的人来说，省下的正是最琐碎的那部分沟通成本。

• stagewise官网入口网址：https://stagewise.io/

操作方式

• 浏览器内点选：直接选中要调整的组件，不需要自己手写选择器定位。
• 上下文自动打包：DOM 信息、截图和页面元数据一起发送，AI 拿到的线索比纯文字描述完整。
• 对接已有代理：配合 Cursor、Windsurf 等工具使用，原有的编码习惯不用改变。
• 开发模式运行：只在本地调试阶段生效，不会进入生产环境，线上代码不受影响。

框架支持

• 主流技术栈：React、Vue、Svelte、Next.js 等项目都能接入，不必为它单独重构。
• MCP 连接：支持通过 MCP 服务器与 AI 协同，兼顾执行性能与数据安全。
• 插件接口：提供了扩展入口，可以按项目实际需要自行增加能力。
• 开源协作：核心技术开源，企业级功能走商业化路线，社区可以参与贡献。

从实际开发场景看，stagewise 更像是在浏览器和编辑器之间架了一块跳板：问题出在哪儿，就在哪儿动手，省掉了先翻译成文字描述的中间环节。它的核心功能围绕可视化交互和精准上下文传递展开，覆盖常见前端技术栈，也留出了插件和 MCP 这类扩展空间。做改样式、调布局、修组件这些活儿的时候，把它和手边的 AI 代理搭配使用，节奏会比反复截图打字顺畅不少，值得放进日常开发流程里试一段时间。