源文档:https://github.com/vuejs-ai/skills
Vue 3 开发的代理技能。
🚧 早期实验/社区项目
这个仓库是一个早期实验项目,旨在为人工智能代理开发专门技能,以增强Vue 3的开发能力。这些技能源自现实世界的问题,但由于可能存在错觉,可能并不完整------请提供反馈。如果这些技能有价值,我计划提议将此项目转移到Vue组织,以造福更广泛的社区。
安装
javascript
npx skills add vuejs-ai/skills
Claude code代码市场
Claude Code用户的另一种选择:
javascript
# 添加市场
/plugin marketplace add vuejs-ai/skills
# 立刻安装skills
/plugin install vue-skills-bundle@vue-skills
# 安装个人skills
/plugin install vue-best-practices@vue-skills
# 安装多项skills
/plugin install vue-best-practices@vue-skills vue-router-best-practices@vue-skills
用法
为了获得最可靠的结果,请在指令前加上"Use vue skill:"
Use vue skill, <你的提示词>
这明确触发了技能,并确保人工智能遵循文档中记录的模式。如果没有前缀,技能的触发可能会因你的提示与技能描述关键词的匹配程度而变得不一致。
| skill | 何时使用 | 描述 |
|---|---|---|
| vue-best-practices | Vue 3 + 组合式 API + TypeScript | 最佳实践、常见陷阱、服务器端渲染(SSR)指南、性能 |
| vue-options-api-best-practices | 选项式 API (data(), methods) |
此上下文,生命周期,带选项的TypeScript API |
| vue-router-best-practices | Vue Router 4 | 导航守卫、路由参数、路由组件的生命周期 |
| vue-pinia-best-practices | Pinia for state management | 存储设置、反应性、状态模式 |
| vue-testing-best-practices | 编写组件 或 E2E tests | Vitest、Vue Test Utils、Playwright |
| vue-jsx-best-practices | JSX in Vue | 与 React JSX 的语法差异 |
| vue-debug-guides | Debugging Vue 3 issues | 运行时错误、警告、异步错误处理、数据加载问题 |
| create-adaptable-composable | Creating reusable composables | MaybeRef/MaybeRefOrGetter输入模式 |
| [可用skills] |
示例
vue-best-practices
提示词
javascript
create a todo app
使用skills后的变化
1.更具可读性的代码
2.组件拆分
3.将状态移入可组合组件(useTodos.ts)
4.对原始响应式数据使用 shallowRef(请参阅响应式参考文档)
create-adaptable-composable
源自serkodev/vue-skills的"创建无关、可组合"部分
提示词
javascript
create a reusable composable for controlling hidden for a element
使用skills后的变化
为输入参数使用了MaybeRef和MaybeRefOrGetter,以实现反应性的灵活性。
javascript
export interface UseHiddenOptions {
hidden?: MaybeRef<boolean>
initialHidden?: MaybeRefOrGetter<boolean>
syncAria?: boolean
}
export function useHidden(
target?: MaybeRefOrGetter<HTMLElement | null | undefined>,
options: UseHiddenOptions = {},
)
方法论
技能类型
技能分为两类:
能力:没有技能,人工智能无法解决问题。这些技能可以解决特定版本的问题、未记录的行为、最新功能或人工智能训练数据之外的边缘情况。
效率:人工智能能够解决问题,但效果并不理想。这些提供了最优模式、最佳实践和一致的方法,以提高解决方案的质量。
验证流程
每条技能规则都通过自动评估进行验证:
基线:未安装技能时的运行情况
With-skill:安装后即可运行
只有当一条规则能让模型解决没有它就无法解决的问题时,才会保留这条规则。
| 基础版 | 使用skills | 行动 |
|---|---|---|
| 失败 | 通过 | 保留 |
| 通过 | 通过 | 视为已移除 |
| [验证流程] |