VueUse v15.0.0 已经落地。这是这个库第一次由 VueUse Team 集体主导的 Major Version，Anthony Fu 在社交平台上确认了这一点，并点名致谢 Orbis、ilyaliao、43081j、serkodev、vida_0905 等小组成员。他没有宣布退出，但版本主导权的转移信号已经足够清晰。
真正让人多看两眼的，是团队接棒后的第一个大版本，直接塞进来一个面向 AI Agent 的能力：useWebMCP。
VueUse 到底是什么定位
写过一段时间 Vue 3 的人大概率都碰过它。一句话概括：Vue Composition API 的工具合集。
目前它提供 200+ 个函数，覆盖状态管理、DOM 操作、浏览器 API、传感器、网络、动画、响应式、时间处理等场景，同时支持 Tree Shaking、TypeScript 和 SSR。
日常高频出现的那些名字：useMouse、useDark、useClipboard、useLocalStorage、useEventListener、useFetch、useWebSocket、useIntersectionObserver。原本要自己监听事件、管理生命周期、清理副作用的代码，它都封装成了符合 Vue 响应式习惯的 Composable。
拿鼠标坐标举例：
就这么多。对很多 Vue 工程师来说，VueUse 早就不只是普通工具库，更像 Vue Composition API 的基准扩容包。
Anthony Fu 与这个库的关系变化
聊 VueUse 绕不开 antfu。他创建了 VueUse、Vitest、UnoCSS、Slidev，同时也是 Vue、Nuxt、Vite 核心团队成员，长期活跃在前端工程化和开源体系里。
Vue、Vite、Nuxt、Vitest、UnoCSS、Shiki、ESLint Stylistic，这些项目背后都能看到他的参与。VueUse 是他很早就开始长期维护的项目之一。
随着体量膨胀，VueUse 从个人开源项目逐步变成团队共同维护的基础设施。到了 v15，官方明确强调这是第一个由 VueUse Team 主导的 Major Version。所以这个版本的意义不止是多了几个 API，维护模式本身也进入了新阶段。
Web MCP 解决的是什么问题
现在不少 AI Agent 已经能帮人操作网页，但主流方式本质上是“能看懂网页的机器人”。
比如让 Agent 订机票，链路大致是：读取页面、找输入框、填城市、找日期、点搜索、分析结果、再点击。背后依赖截图、DOM、Accessibility Tree 等页面信息。
这条路能跑通，但天然有个硬伤：太依赖页面结构。按钮换个位置、DOM 改一下、交互逻辑调整，Agent 就可能重新迷路。
Web MCP 想解决的就是这件事。它允许网站主动向 AI Agent 暴露一组结构化的 Tool。比如机票网站可以提供 searchFlights、selectFlight、getBooking、confirmBooking。
Agent 不需要满页面找“搜索”按钮，也不用猜某个按钮干什么。网站直接告诉它：这里有个 searchFlights Tool，需要这些参数，你直接触发就行。
交互模式从“AI Agent → 理解页面 → 找元素 → 模拟点击”，逐步变成“AI Agent → 发现 Tool → 传入参数 → 直接执行”。对 Agent 来说，这是两种完全不同的体验。
Chrome 已经在推 Web MCP
Web MCP 已经进入浏览器层面。Chrome 正式推动这件事，Google 先开放了 Web MCP Early Preview，随后通过 Chrome 的 Origin Trial 推进真实网站测试。
本地开发可以开启相关实验 Flag：chrome://flags/#enable-webmcp-testing
Chrome DevTools 也加了专门的 Web MCP 调试能力，能直接查看：页面注册了哪些 Tool、每个 Tool 的 Schema、Tool 需要哪些参数、Agent 触发了什么、Tool 最终返回了什么。
这里有个坑要提醒：Web MCP 目前仍属于实验阶段的 Web 能力，距离全面稳定普及还有距离。生产环境不建议直接押注，但值得提前了解。
Chrome 的态度已经很明确：浏览器正在为 AI Agent 提供原生 API。就在这个时间点，VueUse v15 跟上了。
useWebMCP 怎么用
原生使用 Web MCP，需要通过类似下面的浏览器 API 注册 Tool：
document.modelContext.registerTool()
对 Vue 工程师来说，直接处理这些 API 还要考虑组件生命周期、注册、注销、响应式状态等一系列问题。VueUse v15 直接包成了 useWebMCP。
它的作用很直接：注册一个 Web MCP Tool，并把 Tool 生命周期绑定到当前 Vue Scope。比如做一个 Todo List：
import { useWebMCP } from '@vueuse/core'
import { shallowRef } from 'vue'
const todos = shallowRef<string[]>([])
useWebMCP({
name: 'add-todo',
description: 'Add a new item to the user\'s active todo list',
inputSchema: {
type: 'object',
properties: {
text: {
type: 'string',
},
},
required: ['text'],
},
async execute({ text }) {
todos.value = [...todos.value, text]
return `Added todo item: "${text}" successfully.`
},
})
注册完成后，具备 Web MCP 能力的 Agent 就能发现 add-todo 并直接调用它。以前 Agent 可能需要先找到输入框、填写内容、再寻找 Add 按钮；现在可以直接触发 add-todo、传入文本、完成操作。
VueUse 已经帮你把 Vue 生命周期接上了：组件出现，Tool 注册；组件销毁，Tool 自动注销。name、description、inputSchema、enabled 等配置还能直接使用 Vue 的响应式数据。
这就是 useWebMCP 真正有意思的地方。Chrome 给 Agent 铺路，VueUse 紧接着把这条路接到了 Vue 上。
另外两个新 Composable
除了 useWebMCP，v15 还新增了两个 Composable。
useLiveAnnouncer 偏无障碍方向，可以动态向 Screen Reader 播报页面状态变化，适合表单结果、异步操作、Toast、数据加载完成等场景。
useTemporalNow 则围绕 JavaScript 新一代日期时间 API Temporal 提供响应式时间能力。
从新增功能看，v15 的三个重心很清晰：AI Agent、Accessibility、Temporal。
升级前必须检查的几个破坏性变更
Major Version 自然要清掉一批历史包袱，以下几条升级前务必确认。
Node.js 20 不再支持。VueUse v15 放弃对 Node.js 20 的支持。如果公司老项目还停留在 Node 20，升级前先检查 Node 环境。
templateRef 被删除。Vue 本身已经提供了 useTemplateRef，继续维护一套重复能力价值不大。
Timer API 统一采用 scheduler。Timer 相关 Composable 中已废弃的旧配置这次被正式移除，后续统一采用 scheduler。
useThrottleFn 默认行为变化。这是最容易踩坑的地方：useThrottleFn 的 trailing 默认值从 false 改成了 true。直接升级 v15 后，一些节流函数收尾触发的行为可能发生变化。如果项目里大量使用 useThrottleFn，升级后建议重点验证。
顺手修掉的一批问题
新功能之外，v15 还集中处理了不少长期问题，比较值得关注的有：
恢复部分函数的 Tree Shaking 标记；useFetch 避免旧请求结果覆盖新请求；useWebSocket 忽略已失效连接发送的消息；useResizeObserver 避免 Comment Node 导致崩溃；useBluetooth 修复重复监听和重新挂载问题；onLongPress 正确处理 pointercancel；usePointer 在 pointercancel 后正确重置状态；useIDBKeyval 支持跨 Tab 同步。
这些更新不如 Web MCP 吸睛，但对真正在线上使用 VueUse 的项目来说，反而更实在。
测试验证方法
升级到 v15 后，建议按以下方式验证关键行为。
检查 Node 版本：node -v，确认输出不低于 Node 22。
全局搜索 useThrottleFn 调用点，重点检查依赖 trailing 为 false 的逻辑。可以在测试用例中模拟连续触发后停止输入，观察是否多执行了一次。
搜索 templateRef 的使用，替换为 Vue 的 useTemplateRef。
检查 useFetch 相关逻辑，确认并发请求场景下旧请求不会覆盖新请求结果。
如果用到 useIDBKeyval，开两个浏览器 Tab 验证跨 Tab 同步是否生效。
适用与不适用场景
useWebMCP 适合：需要让 AI Agent 直接操作网页功能的场景、内部工具、实验性项目、面向未来的技术预研。
不建议：生产环境核心链路直接依赖 Web MCP。它仍是实验性能力，浏览器支持范围有限，API 可能变化。
useLiveAnnouncer 适合有明确无障碍需求的产品，普通项目按需引入即可。
useTemporalNow 适合需要处理时区、日期计算的场景，但 Temporal 本身在不同运行时支持程度不一，上线前需确认目标环境。
最后
VueUse v15 有两层变化。一层是项目治理：Anthony Fu 把 Major Version 的主导权进一步交给 VueUse Team。另一层是 Web 技术走向：Chrome 推动 Web MCP，VueUse 紧接着把 Web MCP 封装进 Vue。
VueUse 一直在做同一件事：把浏览器里不好用、难管理的 API，封装成 Vue 工程师熟悉的 Composable。到了 AI Agent 时代，思路没变，只是这次封装的是浏览器与 AI Agent 之间的新 API。
现在的 useWebMCP 或许只是一个小 API。但如果将来 Agent 真正成为浏览器里的常驻能力，“给 AI 暴露 Tool”很可能会像今天“给用户写 UI”一样普遍。
团队接棒后的第一个大版本，就直接杀进 AI Agent。VueUse v15，值得关注。
