该技能面向 Vue.js 开发任务，要求使用并在实践中遵循其最佳实践。其核心主张是：以 Composition API 配合 <script setup> 和 TypeScript 作为标准方案，覆盖 Vue 3、SSR、Volar 等。
用途
- 作为 Vue.js 任务的必用技能，提供 Vue 3 最佳实践、常见陷阱与性能优化的系统性指引。
- 帮助开发者在编写 Vue 3 代码时避免常见错误，并做出更优的架构与性能选择。
主要能力（按主题组织）
- 响应式：处理 ref() 的 .value 访问、reactive() 解构丢失响应性、ref 与 reactive 的选择、数组与集合中的 ref、浅层 ref 性能、模板中嵌套 ref 解包、响应式对象 === 比较、markRaw 处理非响应式实例、同一 tick 批处理、外部状态管理集成、用 computed 而非 watchEffect 派生状态。
- 计算属性：避免副作用、返回值只读、条件依赖、数组变更破坏原数据、缓存与方法的区别、不支持参数、类绑定逻辑抽取。
- 监听器：监听响应式对象属性、深度监听性能、watchEffect 异步依赖追踪、刷新时机、watch 与 watchEffect 选择、immediate 选项、深度监听同一对象引用、模板 ref 刷新时机。
- 组件：Props 只读、事件不冒泡、PascalCase 命名、自引用组件名、局部注册优先、以 props/emit 替代组件 ref 耦合。
- Props 与 Emits：布尔 prop 转换顺序、组合式函数响应性丢失、解构 props 的监听、校验时机、事件命名 kebab-case、事件负载校验。
- 模板：v-html 的 XSS 安全、避免 v-if 与 v-for 同用、模板函数无副作用、用 computed 过滤/排序列表、v-if 与 v-show 选择。
- 表单与 v-model：defineModel 隐藏修饰符、更新后立即取值的 nextTick、Vue 2 到 Vue 3 的 v-model 破坏性变更。
- 事件与修饰符：.once、.exact、鼠标按键修饰符、.passive 与 .prevent 的冲突。
- 生命周期：钩子同步注册、updated 钩子性能。
- 插槽：渲染作用域仅父级、具名与作用域插槽混用、v-slot 只能用于组件或 template、条件渲染、defineSlots 类型、默认内容、隐式默认内容、name 为保留 prop、无渲染组件与组合式函数的选择。
- Provide/Inject：Symbol 键、在提供方集中变更、避免 prop drilling。
- Attrs：连字符属性访问、attrs 非响应式。
- 组合式函数：避免隐藏副作用、组合模式、命名与返回模式、选项对象模式、只读状态、与工具函数的区别。
- Composition API：打包体积与压缩、代码组织、替代 mixins、不应套用函数式编程、与 Options API 共存迁移、与 React Hooks 的差异。
- 自定义指令：参数只读、避免用于组件、清理时机、函数简写、命名 v- 前缀、优先声明式模板、与组件的选择、Vue 2 迁移钩子。
- 过渡与动画：单元素插槽、同元素 key、JS 钩子 done 回调、TransitionGroup key、transform/opacity 性能、flip 内联元素、绝对定位移动动画、Vue 3 无默认包裹、无 mode prop、交错动画、mode out-in、嵌套时长、可复用 scope 样式、RouterView appear、type 混合、卸载钩子时机；以及基于 class、key 触发重渲染、状态驱动、列表性能等动画技巧。
- KeepAlive：内存管理、组件名匹配、无法移除缓存、路由新鲜度与缓存、嵌套路由双重挂载、与 Transition 的内存泄漏、动态组件状态。
- 异步组件：Vue Router 集成、Suspense 控制、水合策略、加载延迟。
- 渲染函数：从 setup 返回不响应、vnode 唯一性、列表 key、事件修饰符、v-model 实现、resolveComponent、避免内部 vnode 属性、函数式组件、自定义指令、避免过度重渲染、优先模板、Vue 3 h 导入、插槽作为函数、理解 vdom block。
- Teleport：CSS 定位问题、响应式禁用、逻辑层级保留、多组件同目标、scope 样式限制。
- Suspense：事件跟踪状态、实验性 API、回退不立即显示、嵌套 suspensible、与 Router/Transition/KeepAlive 嵌套顺序、回退仅根变更、单子节点要求。
- TypeScript：基于类型的 defineProps、withDefaults 可变工厂、reactive 无泛型、模板 ref 空值、组件 ref 类型、自定义指令类型增强、defineEmits 类型语法、布尔默认值、导入类型限制、事件处理显式类型、注入键、动态组件 shallowRef、模板联合类型转换。
- SSR：跨请求状态污染、平台特定 API、自定义指令 getSSRProps。
- 性能：props 稳定性、虚拟化长列表、v-once/v-memo、避免列表中组件抽象、computed 对象稳定性、SSR/SSG 优化页面加载。
- 单文件组件（SFC）：构建项目推荐使用、scoped CSS 作用于子组件、动态内容样式、选择器性能、插槽内容样式、关注点共置、样式绑定 camelCase、Tailwind 动态类。
- 插件：全局属性在 setup 中的可用性（资料在“插件”部分被截断，后续内容暂未提供）。
使用方式
- 在涉及 Vue.js 的任务中调用本技能，按其条目对照检查代码，遇到相关问题跳转到对应参考条目（如“See ref-value-access”“See computed-no-side-effects”等）。
- 具体安装与集成命令：资料未提供。
适用场景
- Vue 3 项目开发、代码审查、重构、从 Vue 2 迁移、SSR 应用、性能优化、TypeScript 类型完善、单文件组件实践等。
限制
- “插件”章节后内容被截断；技能的安装方式、计费、平台支持等细节暂未提供。
- 每条参考条目的具体内容需查看对应条目文档，本介绍仅汇总主题与问题点。