get_component_slots

Retrieve slot information for Element-UI components including slot names, scoped parameters, and descriptions to enable accurate Vue 2 code generation.

Instructions

获取 Element-UI 组件的所有插槽（Slots）信息，包括插槽名称、作用域参数、描述等。

Input Schema

TableJSON Schema

Name	Required	Description	Default
`tagName`	Yes	组件标签名, 例如：el-button
`slotName`	No	获取特定插槽的名称，不指定则返回所有插槽

Implementation Reference

src/tools/get-component-slots.ts:36-69 (handler)

The asynchronous handler function implementing the core logic of the 'get_component_slots' tool. It retrieves component slots from metadata, filters by slotName if provided, handles missing components/slots with errors listing alternatives, and returns structured JSON content.

  async ({ tagName, slotName }) => {
    const component = componentObject[tagName]

    if (!component) {
      throw new Error(`Component "${tagName}" not found. Available components: ${Object.keys(componentObject).join(', ')}`)
    }

    let resultSlots = component.slots || []

    // 如果指定了插槽名，过滤特定插槽
    if (slotName) {
      resultSlots = resultSlots.filter(slot => slot.name === slotName)
      if (resultSlots.length === 0) {
        throw new Error(`Slot "${slotName}" not found in component "${tagName}". Available slots: ${component.slots?.map(s => s.name).join(', ') || 'none'}`)
      }
    }

    const result = {
      tagName,
      slots: resultSlots,
      total: (component.slots || []).length,
    }

    return {
      structuredContent: result,
      content: [
        {
          type: 'text' as const,
          text: JSON.stringify(result, null, 2),
        },
      ],
    }
  }
)

src/tools/get-component-slots.ts:12-35 (schema)

Zod-based input and output schemas defining the tool interface: input requires tagName (e.g., 'el-button'), optional slotName; output includes tagName, array of slots (with name, description, parameters, ts), and total count.

{
  title: 'Get Component Slots',
  description: '获取 Element-UI 组件的所有插槽（Slots）信息，包括插槽名称、作用域参数、描述等。',
  inputSchema: z.object({
    tagName: z.string().describe('组件标签名, 例如：el-button'),
    slotName: z.string().optional().describe('获取特定插槽的名称，不指定则返回所有插槽'),
  }),
  outputSchema: z.object({
    tagName: z.string().describe('组件标签名'),
    slots: z.array(
      z.object({
        name: z.string().describe('插槽名'),
        description: z.string().optional().describe('插槽描述'),
        parameters: z.array(
          z.object({
            raw: z.string().describe('参数类型'),
          })
        ).optional().describe('作用域插槽的参数'),
        ts: z.string().optional().describe('TypeScript 签名'),
      })
    ),
    total: z.number().describe('插槽总数'),
  }),
},

src/tools/get-component-slots.ts:9-70 (registration)

Module-level registration function that registers the 'get_component_slots' tool on the MCP server using server.registerTool with name, schema, and handler.

export function registerGetComponentSlots(server: McpServer) {
  server.registerTool(
    'get_component_slots',
    {
      title: 'Get Component Slots',
      description: '获取 Element-UI 组件的所有插槽（Slots）信息，包括插槽名称、作用域参数、描述等。',
      inputSchema: z.object({
        tagName: z.string().describe('组件标签名, 例如：el-button'),
        slotName: z.string().optional().describe('获取特定插槽的名称，不指定则返回所有插槽'),
      }),
      outputSchema: z.object({
        tagName: z.string().describe('组件标签名'),
        slots: z.array(
          z.object({
            name: z.string().describe('插槽名'),
            description: z.string().optional().describe('插槽描述'),
            parameters: z.array(
              z.object({
                raw: z.string().describe('参数类型'),
              })
            ).optional().describe('作用域插槽的参数'),
            ts: z.string().optional().describe('TypeScript 签名'),
          })
        ),
        total: z.number().describe('插槽总数'),
      }),
    },
    async ({ tagName, slotName }) => {
      const component = componentObject[tagName]

      if (!component) {
        throw new Error(`Component "${tagName}" not found. Available components: ${Object.keys(componentObject).join(', ')}`)
      }

      let resultSlots = component.slots || []

      // 如果指定了插槽名，过滤特定插槽
      if (slotName) {
        resultSlots = resultSlots.filter(slot => slot.name === slotName)
        if (resultSlots.length === 0) {
          throw new Error(`Slot "${slotName}" not found in component "${tagName}". Available slots: ${component.slots?.map(s => s.name).join(', ') || 'none'}`)
        }
      }

      const result = {
        tagName,
        slots: resultSlots,
        total: (component.slots || []).length,
      }

      return {
        structuredContent: result,
        content: [
          {
            type: 'text' as const,
            text: JSON.stringify(result, null, 2),
          },
        ],
      }
    }
  )
}

src/index.ts:35-35 (registration)
Application-level invocation of the tool registration during server setup in the main entry point.
```
registerGetComponentSlots(server);
```
src/index.ts:11-11 (registration)
Import statement for the get_component_slots registration module.
```
import { registerGetComponentSlots } from './tools/get-component-slots.js';
```

Element-UI MCP Server