javascript-typescript

此技能为使用现代 JavaScript 与 TypeScript 生态系统构建和维护稳健的 Web 应用程序提供专业协助。它专为软件工程师、前端开发人员和全栈架构师设计，用于管理复杂状态、实现类型安全的 React 模式，并透过严格的自动化测试策略确保代码质量。无论您是使用 Vite 构建新应用程序、迁移旧有代码或优化性能，此代理程序都能为架构设计与日常开发任务提供结构化的支持。

• 专家级 TypeScript 配置：优化 compilerOptions、严格模式设置及模块化开发的路劲别名。

• 进阶类型模式：实作可辨识联集 (Discriminated Unions)、泛型约束 (Generic Constraints)、工具类型 (Utility Types) 以及自定义类型防护 (Type Guards) 以确保执行时期安全性。

• React 19+ 最佳实践：设计高性能组件，利用自定义 Hooks 分享状态，并透过 useEffect/useCallback 有效处理副作用。

• 测试套件自动化：配置并执行 Vitest 单元测试、覆盖率报告分析，以及使用 Playwright 实作基于浏览器的完整端对端测试工作流程。

• 现代工具整合：管理 ES Modules、node: 内置模块导入，以及现代前端项目中常见的复杂依赖关系图。

• 使用此技能重构现有 React 逻辑、除错类型不匹配问题或设置持续集成工作流程。

• 定义数据结构时，优先选择可辨识联集而非宽松的接口，以最大化 TypeScript 类型缩小 (Type-narrowing) 的性能。

• 确保 Node.js 或浏览器 fetch 调用中的所有异步逻辑均使用适当的错误处理模式，例如 try/catch 区块或 unhandledRejection 监听器。

• 对于 Playwright 自动化，请确保在执行测试套件前，环境已配置并安装必要的浏览器二进制文件 (chromium/firefox)。

• 性能限制：处理大量数据时，善用浏览器原生 API 与高效的数组方法（如 filter、map、reduce）以最小化主线程阻塞。

• 输入/输出：提供源代码或设置片段进行目标重构；代理程序将回传类型安全、生产就绪的代码区块与依赖建议。