codegen-engine-mcp

使用AI代码生成引擎MCP工具进行智能前端代码生成。当用户需要生成页面代码、创建组件、做列表页/表单页/详情页、或询问如何使用代码生成MCP工具时使用此skill。

浏览器兼容性检测技能。当用户需要检测CSS/JS兼容性、处理浏览器差异、添加polyfill、或询问如何支持旧版浏览器时使用此skill。

无障碍访问技能。当用户需要改进无障碍支持、添加ARIA属性、检查可访问性、或询问如何让网页对残障用户友好时使用此skill。

API接口对接技能。当用户需要对接接口、调用API、封装请求、处理接口数据、或询问如何进行接口集成时使用此skill。

打包优化技能。当用户需要优化打包体积、分析Bundle大小、实现代码分割、或询问如何减小构建产物时使用此skill。

代码审查技能。当用户需要审查代码、检查代码质量、发现潜在问题、评估代码规范、或询问如何改进代码时使用此skill。

组件重构和优化技能。当用户需要重构组件、拆分组件、优化组件结构、提取公共逻辑、或询问如何改进组件设计时使用此skill。

表单生成技能。当用户需要生成表单、创建表单页面、做表单验证、实现动态表单、或询问如何处理表单逻辑时使用此skill。

性能审计技能。当用户需要分析性能问题、优化加载速度、解决渲染卡顿、或询问如何提升前端性能时使用此skill。

React Hooks技能。当用户需要编写自定义Hooks、理解Hooks用法、封装Hooks逻辑、或询问React状态管理时使用此skill。

状态管理技能。当用户需要实现全局状态管理、使用Redux/Zustand/Pinia、处理跨组件状态、或询问如何管理应用状态时使用此skill。

样式编写技能。当用户需要编写CSS样式、使用Tailwind CSS、实现响应式布局、或询问如何组织样式代码时使用此skill。

表格生成技能。当用户需要生成表格、创建列表页、做数据展示、实现分页排序筛选、或询问如何处理表格逻辑时使用此skill。

单元测试技能。当用户需要编写单元测试、创建测试用例、使用测试框架、或询问如何进行前端测试时使用此skill。

Vue Composables技能。当用户需要编写Vue组合式函数、理解Composition API、封装composables逻辑、或询问Vue3状态管理时使用此skill。

使用MCP浏览器自动化工具进行前端测试和网页交互。当用户需要测试前端页面、自动化网页操作、验证UI交互、截图对比、或询问如何使用浏览器MCP工具时使用此skill。