SuperAPI AI 工具集

component-inventory

前端与建站

查看项目

更新于 10-29 09:08

技能介绍

用途 Component Inventory 是一个技能(Skill),用于扫描代码库,审计和盘点现有的 UI 组件,识别组件变体、使用模式以及可整合的机会。

主要能力

  • 扫描代码库中的 React/Vue/Angular 组件
  • 识别组件变体与重复项
  • 映射组件在应用中的使用位置
  • 生成完整的组件盘点报告
  • 检测组件实现中的不一致
  • 跟踪组件依赖关系

使用方式 通过 skill.execute 调用,传入输入配置(Input Schema)并获取结构化输出(Output Schema)。输入对象要求提供 scanPath(扫描根路径),可选配置包括:framework(可选 react、vue、angular、svelte、auto,默认 auto)、patterns(匹配模式,默认 /*.tsx、/.jsx、**/.vue)、excludePaths(排除路径,默认 node_modules、dist、build)、analyzeProps(是否分析 props,默认 true)、detectDuplicates(是否检测重复,默认 true)。 输出包含:components(含名称、路径、props、使用次数)、duplicates(相似或重复组件)、variations(按类型分组的组件变体)、usageMap(组件使用位置)、statistics(总组件数、唯一组件数、平均 props 数等统计)、recommendations(整合建议)。

集成点

  • 通过 AST 解析分析 React 组件
  • Vue 单文件组件(SFC)分析
  • TypeScript/JavaScript AST 解析
  • CSS-in-JS 检测

目标流程 component-library.js 与 design-system.js。

适用场景 适用于在组件库或设计系统建设中,对既有代码库进行组件资产盘点、发现重复组件与实现不一致,为组件整合提供依据。

限制 资料未提供该技能的具体运行环境、依赖安装方式、性能表现或收费信息,暂未提供。