vue-skills – Vue官方AI Agent编程技能库

vue-skills由Vue核心团队联合VoidZero研发，遵循Agent Skills开放规范，整合Vue3、Pinia、Vue Router、VueUse全套官方编码准则并封装为标准化知识库；通过npx一键部署至Cursor、Claude Code等AI编码工具，约束AI产出代码贴合官方规范，根治代码可运行但不规范、不符合工程最佳实践的痛点。

一、全维度技能模块：

1、Vue3最佳实践：

Composition API标准写法、开发踩坑规避、SSR性能优化、项目工程化规范。

2、Options API编码规范：

this上下文管控、生命周期用法、TS类型兼容方案。

3、Vue Router4规范：

导航守卫配置、路由参数解析、路由组件生命周期管控。

4、Pinia状态方案：

Store类型设计、TS自动推导、模块化拆分、标准化响应式写法。

5、标准化测试指南：

Vitest+Vue Test Utils单元测试、Playwright E2E自动化测试规范。

6、Vue专属JSX规则：

厘清Vue JSX与React JSX在作用域、指令语法差异，杜绝混用报错。

7、故障调试知识库：

运行时报错、异步异常、水合(hydration)异常排查方案。

8、Composable标准化封装：

依托MaybeRef/MaybeRefOrGetter规范复用组合式逻辑。

二、产品核心优势：

1、权威原生背书：

Vue核心团队&VoidZero官方维护，内容源自官方文档与线上真实Issue，区别于第三方非官方整理资源。

2、Token轻量化按需加载：

渐进式信息披露机制，仅匹配开发场景时加载对应规则，节省上下文窗口与Token消耗。

3、全生态跨工具适配：

依托统一Agent Skills标准，兼容Cursor、Claude Code、Copilot、Gemini CLI等30+主流AI开发客户端。

4、项目环境智能适配：

交互式配置自动识别项目环境，自动区分Vue2/Vue3、组合式/选项式API、是否接入Pinia等项目特征。

5、规则自动化质检：

全量规则经过自动化评测验证，留存「无技能代码出错、挂载技能代码合规」的有效条目，保障规范可靠性。

三、快速部署流程：

1、安装技能资源：

终端执行`npx skills add vuejs-ai/skills`，拉取Vue技能库至本地；

2、绑定目标编辑器：

根据命令行指引，选定Cursor、Claude Code等目标AI开发工具；

3、划定安装范围：

按需选择全局安装/单项目局部安装，完成安全校验后落地配置；

4、对话启用规则：

AI会话开头添加指令`use vue skill`，主动激活Vue规范约束；

5、下发开发需求：

正常描述开发需求，AI自动引用官方规范生成合规代码。