
助手写 Vue 时容易混用过时写法和含糊的响应式处理。这组技能把组合式接口、选项式接口、路由、状态、测试和排错拆成可单装的模块,并区分两类:没有它就做不对的能力,以及有它才更稳的效率写法。对照评测要求先跑一遍没装技能的基线,再跑有技能的结果,只有把原先失败的题目做成才保留规则。对话里加上指定前缀,用来明确触发。适合已经用编程助手写 Vue 3、又希望输出靠近这些文档约定的前端开发者。
vue-skills 是仓库 vuejs-ai/skills 中的一组 Vue 3 开发技能,用来让编程助手按文档里的写法处理组合式接口、选项式接口、路由、状态和测试。可用技能命令安装整包,也可以在 Claude Code 的插件市场里单装某一个技能。项目自述仍是早期社区实验,规则来自真实问题,但作者提醒内容可能不完整,并打算在验证有价值后再提议交给 Vue 组织。
使用门槛: 需要一定基础
组合式接口写法
vue-best-practices 覆盖组合式接口与类型写法中的常见陷阱、服务端渲染注意点和性能相关写法。
路由与状态技能
路由技能处理导航守卫、路由参数和组件生命周期,状态技能处理仓库搭建与响应式状态模式。
测试与排错指南
测试技能面向组件测试和端到端测试,排错技能覆盖运行时错误、警告、异步错误和水合问题。
可适配的组合函数
create-adaptable-composable 要求入参使用可选取值的响应式类型,调用方可以传普通值或引用。
生成待办应用结构
开发者让助手做待办应用时,技能会把状态放进组合函数,并拆出单独组件。
编写可复用组合函数
编写控制元素显隐的组合函数时,入参按可选取值的响应式类型设计,方便传入普通值或引用。
排查页面水合报错
服务端渲染后出现水合警告时,调用排错技能对照运行时错误和异步错误的处理说明。
按仓库说明,它目前是早期社区实验,不是已经移交的官方项目。作者写明技能来自真实问题,但可能因为模型幻觉而不完整,并欢迎反馈。若之后证明有价值,作者打算提议把项目交给 Vue 组织。使用时应以仓库里的技能文档为准,不要把它写成官方规范。
仓库建议在提示词前加上 use vue skill 这一前缀,用来明确触发技能,让助手遵循文档里的写法。不加前缀时,是否触发取决于提示词和技能描述关键词有多接近,结果可能不稳定。Claude Code 用户也可以从插件市场安装单个技能,例如只装最佳实践或路由技能。
说明里列出了组合式接口、选项式接口、路由、Pinia 状态、测试、JSX、排错,以及创建可适配组合函数。测试技能面向组件测试和端到端测试,排错技能覆盖运行时错误和水合问题。可以单装,也可以一次安装整包。开发在 dev 分支进行,main 分支只放已发布的技能。
来自真实用户的评价和反馈