vue3/skills/code-refactor/SKILL.md
代码重构助手。支持多种重构任务(目前支持魔法数字检测和Vue组件拆分)。当用户想要重构代码、查找硬编码值、进行代码审计或拆分Vue组件时调用。
npx skillsauth add linzb93/trae-docs code-refactorInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
这是一个通用的代码重构工具集,旨在帮助开发者发现代码中的潜在问题并辅助重构。
目前支持以下重构检测任务:
magic-numbers (魔法数字检测):
src 目录下的 .vue 文件。=== 或 !==) 中使用的硬编码数字或字符串。if (status === 1) 或 if (type !== 'admin')。vue-split (Vue 组件拆分提示词生成):
使用 Node.js 运行入口脚本,并通过 --type 参数指定任务类型。
node .claude/skills/code-refactor/scripts/index.js --type magic-numbers
# 扫描 src 目录,自动分析最大的文件
node .claude/skills/code-refactor/scripts/index.js --type vue-split --path src
# 分析指定文件
node .claude/skills/code-refactor/scripts/index.js --type vue-split --path src/views/Home.vue
如果不带参数运行,将显示帮助信息和支持的任务列表:
node .claude/skills/code-refactor/scripts/index.js
该 Skill 采用策略模式设计。如需添加新的重构功能(例如“提取方法”或“变量重命名”),只需在 scripts 目录下添加新的脚本,并在 index.js 中注册即可。
development
处理 YApi 接口文档相关任务。支持打开接口文档、独立生成类型定义,以及在解析接口实现代码时同步生成类型和注释。
testing
专注 Vue3 页面还原与样式实现,仅负责 UI,不写任何逻辑代码。上传设计稿时调用。
testing
识别原型图需求并实现业务逻辑。上传原型图要求分析需求,编写交互逻辑时调用。
tools
将 Vue 3 script setup 代码按逻辑块进行组织,并使用中文注释分隔。当用户要求整理 Vue 代码或清理 script setup 时调用。