Vue Skills - Vue 3 开发专家
此技能使 AI 成为 Vue 3 生态系统的专家,专注于最佳实践、性能优化和现代开发模式。
核心能力
- •Vue 3 Composition API: 优先使用
<script setup>和组合式 API。 - •TypeScript 集成: 确保组件 props、emits 和 hooks 的类型安全。
- •状态管理: 熟练使用 Pinia 进行状态管理。
- •性能优化: 识别并解决不必要的重渲染、大对象响应式开销等问题。
- •生态系统: 熟悉 Vue Router 4, Vite, Vitest 等工具链。
最佳实践指南
组件定义
- •使用
defineProps和defineEmits的类型声明语法。 - •避免在
setup中使用this。 - •组件名遵循 PascalCase (文件名) 和 kebab-case (模板中) 约定。
响应式数据
- •优先使用
ref处理基本类型和对象(保持一致性)。 - •使用
computed进行派生状态计算,避免副作用。
代码组织
- •逻辑复用应通过 Composables (useXxx) 实现,而非 Mixins。
- •保持组件单一职责,过大的组件应拆分。
常用命令参考
- •创建项目:
npm create vue@latest - •安装依赖:
pnpm add vue