如何安装 vue-skills？

可以通过 npx skills add vuejs-ai/skills 命令安装。如果使用 Claude Code，也可以先添加 marketplace，然后通过 /plugin install 命令安装全部或单个技能。

使用时如何触发技能？

为了获得最可靠的结果，建议在 prompt 前加上 use vue skill 前缀，例如 Use vue skill, 。不加前缀时，技能的触发可能不一致。

技能规则是如何验证的？

每条规则都通过自动化评估进行验证：先在未安装技能时运行基线测试，再在安装技能后运行。只有当规则使模型从无法解决问题变为能解决时才保留，否则考虑移除。

这个项目是官方项目吗？

不是。这是一个早期的社区实验项目。作者表示如果项目有价值，计划提议将其转移到 Vue 组织下以服务更广泛的社区。

支持哪些 AI 工具？

原文提到了通用安装方式以及针对 Claude Code 的 Marketplace 安装方式。

2026年9月26日

vue-skills

人工智能提示词工程与 Skill 管理0

获取资源

为 AI Agent 提供 Vue 3 开发相关的技能包，帮助生成更符合最佳实践的代码。

MITClaude Code文本代码

提示词模板 Skill广场技能封装

安装 / 调用方式bash

npx skills add vuejs-ai/skills

调用示例json

Use vue skill, <your prompt here>

产品信息

形态: AI技能 & 智能体
分类: 人工智能 › 提示词工程与 Skill 管理
定价: 开源
平台: Claude Code
授权协议: MIT
首发日期: 2026年9月26日
收录时间: 2026年9月26日
官网: github.com

概览

GitHub GitHub

vue-skills 是一个社区实验项目，旨在为 AI Agent 创建专门用于 Vue 3 开发的技能（skills）。这些技能源自真实开发问题，通过结构化的规则引导 AI 生成更规范、更高质量的 Vue 代码。 ## 它解决什么问题 AI 在生成 Vue 代码时，可能不了解特定版本的行为差异、未文档化的特性或边缘情况。vue-skills 将技能分为两类： - **Capability**：解决 AI 在没有技能时无法处理的问题，如版本特定行为或训练数据之外的边缘情况。 - **Efficiency**：优化 AI 本可以解决但质量不高的问题，提供最佳实践和一致的实现模式。 ## 主要能力项目包含多个细分技能，覆盖 Vue 3 生态的不同方面： - **vue-best-practices**：针对 Composition API 与 TypeScript 的最佳实践、SSR 指导与性能优化。 - **vue-options-api-best-practices**：Options API 的 `this` 上下文、生命周期与 TypeScript 用法。 - **vue-router-best-practices**：Vue Router 4 的导航守卫、路由参数与组件生命周期。 - **vue-pinia-best-practices**：Pinia 状态管理的 store 配置、响应式与状态模式。 - **vue-testing-best-practices**：使用 Vitest、Vue Test Utils、Playwright 编写测试。 - **vue-jsx-best-practices**：Vue 中 JSX 语法与 React JSX 的差异。 - **vue-debug-guides**：运行时错误、警告、异步错误处理与水合问题的调试指南。 - **create-adaptable-composable**：使用 `MaybeRef` / `MaybeRefOrGetter` 模式创建可复用的 composable。 ## 验证机制每条技能规则都经过自动化评估验证。只有在安装技能后模型能从失败变为通过的规则才会被保留；如果安装前后都能通过，该规则会被考虑移除。 ## 适合谁适合在日常开发中使用 AI 编程助手（如 Claude Code）编写 Vue 3 代码的开发者。项目采用 MIT 协议开源。

功能特性

Composition API 最佳实践：提供 Vue 3 + Composition API + TypeScript 的开发规范、SSR 指导与性能建议。
Options API 支持：涵盖 Options API 的 this 上下文、生命周期及 TypeScript 配合使用的注意事项。
Vue Router 4 技能：指导导航守卫、路由参数及路由组件生命周期的正确使用方式。
Pinia 状态管理：提供 Pinia store 配置、响应式处理与状态管理模式的最佳实践。
测试编写指导：支持使用 Vitest、Vue Test Utils 和 Playwright 编写组件测试与 E2E 测试。
Vue JSX 语法：说明 Vue 中 JSX 语法与 React JSX 的具体差异。
调试指南：协助排查运行时错误、警告、异步错误处理及 hydration 问题。
Composable 创建：使用 MaybeRef 和 MaybeRefOrGetter 输入模式创建可复用的 composable。
自动化规则验证：通过基线与技能对比的自动化 evals 验证每条规则的有效性。

版本更新

新版本提醒我

首个版本 · vue-skills

2026年9月26日

Q&A

如何安装 vue-skills？由 AI 生成: 可以通过 npx skills add vuejs-ai/skills 命令安装。如果使用 Claude Code，也可以先添加 marketplace，然后通过 /plugin install 命令安装全部或单个技能。
使用时如何触发技能？由 AI 生成: 为了获得最可靠的结果，建议在 prompt 前加上 use vue skill 前缀，例如 Use vue skill, <your prompt here>。不加前缀时，技能的触发可能不一致。
技能规则是如何验证的？由 AI 生成: 每条规则都通过自动化评估进行验证：先在未安装技能时运行基线测试，再在安装技能后运行。只有当规则使模型从无法解决问题变为能解决时才保留，否则考虑移除。
这个项目是官方项目吗？由 AI 生成: 不是。这是一个早期的社区实验项目。作者表示如果项目有价值，计划提议将其转移到 Vue 组织下以服务更广泛的社区。
支持哪些 AI 工具？由 AI 生成: 原文提到了通用安装方式以及针对 Claude Code 的 Marketplace 安装方式。