手搓 Skill 串联成专属 SubAgent：打造前端代码审查→修复→提交自动化流水线

作为前端开发者，完成代码编写后往往还需要执行一系列繁琐的重复操作：ESLint 检查、修复格式问题、git add、commit、push……这些机械性的工作不仅消耗宝贵的开发时间，还容易在繁忙时遗漏关键步骤。如何真正解放双手，将精力集中在业务逻辑开发上？答案是构建一套完整的自动化流水线。

整体架构设计

本文将介绍如何利用 Cursor 的 Custom Skills 和 SubAgent 功能，搭建一套从代码审查、自动修复到 Git 提交推送的完整自动化解决方案。一次配置即可永久生效，Vue、React、原生 JS 所有前端项目都能直接适配复用。

创建三个独立原子 Skill

遵循单一职责原则，我们先将完整的交付流程拆分为三个独立原子 Skill： **前端代码审查**：仅执行代码规范检测和错误识别，不改动项目任何文件，确保审查结果的专业性和客观性。 **前端代码自动修复**：基于审查结果自动修复 ESLint 语法问题和 Prettier 格式问题，保证代码风格的一致性。 **前端 Git 提交推送**：一键完成 git 暂存、提交信息撰写以及推送到远程仓库的完整流程。 在三个原子 Skill 基础上，再封装一个 SubAgent 来实现串行编排：固定按照「代码审查→代码修复→代码提交」的顺序执行，任一步骤失败则立即中断并提醒用户。这种设计既保证了流程的完整性，又保留了各环节的独立性和灵活性。

封装 SubAgent 实现流程编排

配置完成后支持三种调用方式： **方式一：对话触发**。在 Cursor 聊天框输入自然语言即可调用完整流水线，AI 自动识别并串行执行所有步骤。 **方式二：命令面板触发**。按下 Ctrl+Shift+P（Mac 为 Cmd+Shift+P），搜索 SubAgent 名称后回车启动。 **方式三：单独调用原子 Skill**。若只需执行某个单一操作，可通过命令面板单独调用对应 Skill。 此外还提供失败中断机制，任一步骤报错立即停止，避免错误蔓延。可选的增强容错配置包括：单文件版 Skill 适用于快速修复场景；将 Skill 保存到全局配置可实现跨项目复用。 最终效果：三个 Skill 完全解耦可单独使用，SubAgent 统一编排流程出错自动中断，AI 支持一句话触发完整流水线，一次配置所有前端项目永久通用。这套方案既保留了单个技能的灵活度，又靠 SubAgent 实现了全流程自动化，真正实现检查、修复、提交一键搞定。

三种调用方式与最终效果

从 2025 年起，Cursor 的 Skills 和 SubAgent 功能日趋成熟，官方也提供了 BugBot 等自动化工具。但日常开发中最实用的，还是根据自己项目习惯定制化的自动化流水线。通过本文介绍的方法，你可以快速构建专属的前端交付流水线，彻底告别重复性机械工作，把精力全部投入业务逻辑开发。

如有侵权，请联系删除。