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), }, ], } } )
- 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';