vue-typescript

此技能为使用现代 Vue 3 生态系统的开发人员提供了强大的架构框架。它通过强制执行 TypeScript 最佳实践、响应式状态管理和模块化代码结构，简化了复杂前端组件的实现过程。无论您是从 Options API 迁移，还是从头开始构建新的企业级应用程序，此技能都能确保您的代码库遵循清晰且易于维护的模式。它专为前端工程师、全栈开发人员以及使用最新 Vue 生态工具的团队而设计。

• 全面支持 script setup 语法，结合严格的 TypeScript 接口与类型定义。

• 进阶的组合式函数 (Composables) 开发模式，包含响应式数据获取、生命周期管理以及自定义 Hook 的创建。

• 与 Pinia 的深度整合，用于可扩展的状态管理，包含 Store 定义、store-to-refs 解构以及计算属性 (getters)。

• 标准化的 Vue Router 模式，用于路由定义、延迟加载 (lazy loading) 以及类型安全的参数处理。

• 实现泛型组件以增强跨复杂用户界面的可重用性。

• 使用 VeeValidate 结合 Zod 的表单处理工作流程，实现基于 Schema 的验证。

• 务必使用带有 TypeScript 接口的 defineProps 和 defineEmits，以确保父子组件之间的完全类型安全。

• 使用组合式函数进行跨组件的逻辑共享，以保持组件脚本层的精简与可读性。

• 使用 Pinia 时，优先选择基于 Setup 的 Store 定义，以获得更好的可组合性与 TypeScript 类型推断。

• 确保所有路由参数都经过明确定义，以防止在访问路由数据时发生运行时错误。

• 实现复杂表单时，使用 toTypedSchema 实现 Zod 与 VeeValidate 的无缝整合。

• 输入通常包含组件需求、API 端点规格或业务逻辑工作流程；输出则为功能完备的 Vue 组件、优化的 Store 以及模块化的工具文件。