component-inventory

Audit and inventory existing UI components in a codebase

不碰外部（只输出文字）无严重或高危命中a5c-ai/babysitter

它会碰到什么

扫了多少2 个文本文件，4 KB

它会碰到什么不碰外部（只输出文字）

命中总数0 处

命中统计严重 0 · 高 0 · 中 0 · 低 0

这一栏是扫描器报的事实，不是结论。命中多不等于有毒（安全工具、规则库、示例脚本本来就会包含危险写法），命中少也不等于干净。它和你手上的凭据、文件、网络有什么关系，需要你自己看。

技能内容

Component Inventory Skill

Purpose

Scan codebases to audit and inventory existing UI components, identifying variations, usage patterns, and opportunities for consolidation.

Capabilities

Scan codebase for React/Vue/Angular components
Identify component variations and duplicates
Map component usage across the application
Generate comprehensive inventory reports
Detect inconsistencies in component implementations
Track component dependencies

Target Processes

component-library.js
design-system.js

Integration Points

React component analysis via AST parsing
Vue SFC analysis
TypeScript/JavaScript AST parsing
CSS-in-JS detection

Input Schema

{
  "type": "object",
  "properties": {
    "scanPath": {
      "type": "string",
      "description": "Root path to scan for components"
    },
    "framework": {
      "type": "string",
      "enum": ["react", "vue", "angular", "svelte", "auto"],
      "default": "auto"
    },
    "patterns": {
      "type": "array",
      "items": { "type": "string" },
      "default": ["**/*.tsx", "**/*.jsx", "**/*.vue"]
    },
    "excludePaths": {
      "type": "array",
      "items": { "type": "string" },
      "default": ["node_modules", "dist", "build"]
    },
    "analyzeProps": {
      "type": "boolean",
      "default": true
    },
    "detectDuplicates": {
      "type": "boolean",
      "default": true
    }
  },
  "required": ["scanPath"]
}

Output Schema

{
  "type": "object",
  "properties": {
    "components": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "name": { "type": "string" },
          "path": { "type": "string" },
          "props": { "type": "array" },
          "usageCount": { "type": "number" }
        }
      }
    },
    "duplicates": {
      "type": "array",
      "description": "Similar or duplicate components"
    },
    "variations": {
      "type": "object",
      "description": "Component variations grouped by type"
    },
    "usageMap": {
      "type": "object",
      "description": "Component usage locations"
    },
    "statistics": {
      "type": "object",
      "properties": {
        "totalComponents": { "type": "number" },
        "uniqueComponents": { "type": "number" },
        "averagePropsCount": { "type": "number" }
      }
    },
    "recommendations": {
      "type": "array",
      "description": "Consolidation recommendations"
    }
  }
}

Usage Example

const result = await skill.execute({
  scanPath: './src',
  framework: 'react',
  patterns: ['**/*.tsx', '**/*.jsx'],
  detectDuplicates: true
});

想直接用这个技能？

本站把开放许可（MIT / Apache 等）的技能按仓库打包整理到网盘，点一下转存到你自己的网盘，不用一个个从 GitHub 拉。许可未声明的技能只给原始仓库链接，不打包。

去原始仓库

它属于哪个仓库

仓库a5c-ai/babysitter

星标★ 1,796

本站分层T1

该仓技能数2115

原文件路径library/specializations/ux-ui-design/skills/component-inventory/SKILL.md

同一个仓库里的其他技能

看这个仓库的全部 2115 个技能