sloth-d2c-mcp 1.0.4-beta76 → 1.0.4-beta78

package/dist/build/core/prompt-builder.js

@@ -48,15 +48,85 @@ export function buildUserPromptText(userPrompt) {
         return '';
     return '\n## 用户提示词\n以下是用户针对该代码的优化提出的补充说明和要求，请在优化代码时特别关注这些指导并尽可能实现：\n' + userPrompt;
 }
+/**
+ * 递归获取组件的继承链
+ * @param component 当前组件
+ * @param allComponents 所有组件映射表
+ * @param visited 已访问的组件名称（防止循环引用）
+ * @returns 继承链数组（从当前组件到最顶层父类）
+ */
+function getInheritanceChain(component, allComponents, visited = new Set()) {
+    const chain = [];
+    // 防止循环引用
+    if (visited.has(component.name)) {
+        return chain;
+    }
+    visited.add(component.name);
+    // 如果有父类，递归查找
+    if (component.super) {
+        const parentComponent = allComponents.get(component.super);
+        if (parentComponent) {
+            chain.push(parentComponent);
+            // 递归获取父类的继承链
+            const parentChain = getInheritanceChain(parentComponent, allComponents, visited);
+            chain.push(...parentChain);
+        }
+    }
+    return chain;
+}
+/**
+ * 格式化组件信息为提示词
+ * @param component 组件信息
+ * @param isParent 是否是父类组件
+ * @returns 格式化的组件提示词
+ */
+function formatComponentPrompt(component, isParent = false) {
+    let prompt = '';
+    const propsInfo = component.props && component.props.length > 0
+        ? component.props.map((p) => `${p.name}${p.required ? ' (必需)' : ' (可选)'}: ${p.type || 'any'} - ${p.description}`).join(', ')
+        : '无';
+    const libInfo = component.lib ? ` (来自 ${component.lib})` : ' (项目组件)';
+    const descInfo = component.description ? `\n- **描述**: ${component.description}` : '';
+    const parentPrefix = isParent ? '#### ' : '### ';
+    const parentLabel = isParent ? ' [父类]' : '';
+    prompt += `${parentPrefix}${component.name}${libInfo}${parentLabel}\n`;
+    prompt += `- **文件路径**: ${component.path}\n`;
+    prompt += `- **导入方式**: ${component.import}\n`;
+    prompt += `- **Props**: ${propsInfo}${descInfo}\n`;
+    // 如果有 functions，也输出方法信息
+    if (component.functions && component.functions.length > 0) {
+        const functionsInfo = component.functions
+            .map((f) => {
+            const paramsStr = f.params && f.params.length > 0 ? f.params.map((p) => `${p.name}: ${p.type}`).join(', ') : '';
+            const returnStr = f.returnType ? `: ${f.returnType}` : '';
+            const descStr = f.description ? ` - ${f.description}` : '';
+            return `${f.name}(${paramsStr})${returnStr}${descStr}`;
+        })
+            .join('; ');
+        prompt += `- **方法**: ${functionsInfo}\n`;
+    }
+    // 如果有 super，标注继承关系
+    if (component.super) {
+        prompt += `- **继承自**: ${component.super}\n`;
+    }
+    prompt += '\n';
+    return prompt;
+}
 /**
  * 构建组件映射提示词（包含组件映射和组件上下文和组件标记）
  * @param componentMappings 组件映射数组
  * @param componentContexts 所有组的组件上下文数组
  * @param markedComponents 标记的组件数组
+ * @param componentsDatabase 完整的组件数据库（用于查找继承链）
  * @returns 组件映射提示词
  */
-export function buildComponentMappingPrompt(componentMappings, componentContexts = [], markedComponents = []) {
+export function buildComponentMappingPrompt(componentMappings, componentContexts = [], markedComponents = [], componentsDatabase = []) {
     let prompt = '';
+    // 构建完整的组件数据库映射表（用于查找继承链）
+    const databaseMap = new Map();
+    componentsDatabase.forEach((comp) => {
+        databaseMap.set(comp.name, comp);
+    });
     // 收集所有组件：组件映射 + 组件上下文（按名称去重）
     const allComponents = new Map();
     // 添加组件映射的组件
@@ -74,19 +144,28 @@ export function buildComponentMappingPrompt(componentMappings, componentContexts
     // 构建可用组件提示词
     if (allComponents.size > 0) {
         prompt += '\n\n## 可用组件\n\n以下是项目中可用的组件，请在最终代码中使用这些组件：\n\n';
+        // 记录已输出的组件，避免重复输出
+        const outputtedComponents = new Set();
         allComponents.forEach((component) => {
-            const propsInfo = component.props && component.props.length > 0
-                ? component.props.map((p) => `${p.name}${p.required ? ' (必需)' : ' (可选)'}: ${p.type || 'any'}`).join(', ')
-                : '无';
-            const libInfo = component.lib ? ` (来自 ${component.lib})` : ' (项目组件)';
-            const descInfo = component.description ? `\n- **描述**: ${component.description}` : '';
-            prompt += `### ${component.name}${libInfo}\n`;
-            prompt += `- **文件路径**: ${component.path}\n`;
-            prompt += `- **导入方式**: ${component.import}\n`;
-            prompt += `- **Props**: ${propsInfo}${descInfo}\n\n`;
+            // 输出当前组件
+            if (!outputtedComponents.has(component.path)) {
+                outputtedComponents.add(component.path);
+                prompt += formatComponentPrompt(component, false);
+            }
+            // 递归查找并输出继承链（从完整数据库中查找）
+            const inheritanceChain = getInheritanceChain(component, databaseMap);
+            if (inheritanceChain.length > 0) {
+                inheritanceChain.forEach((parentComp) => {
+                    // 避免重复输出
+                    if (!outputtedComponents.has(parentComp.path)) {
+                        outputtedComponents.add(parentComp.path);
+                        prompt += formatComponentPrompt(parentComp, true);
+                    }
+                });
+            }
         });
         prompt +=
-            '**重要**：在最终写入代码时，请根据设计稿需求合理传递 props 参数。请按照项目路径规范合理引入组件。\n';
+            '**重要**：在最终写入代码时，请根据设计稿需求合理传递 props 参数。请按照项目路径规范合理引入组件。如果组件有继承关系，请注意父类的 props 和方法也可以使用。\n';
     }
     // 构建标记组件提示词
     if (markedComponents.length > 0) {

package/dist/build/index.js

@@ -394,8 +394,11 @@ mcpServer.tool('d2c_figma', 'Convert Figma Design File to Code', {
             });
             Logger.log(`收集到 ${markedComponents.length} 个标记的组件`);
         }
-        // 构建组件映射提示词（包含组件映射、组件上下文和标记组件）
-        const componentMappingPrompt = buildComponentMappingPrompt(componentMappings, componentContexts, markedComponents);
+        // 加载完整的组件数据库（用于查找继承链）
+        const componentsDatabase = await fileManager.loadComponentsDatabase();
+        Logger.log(`加载组件数据库，共 ${componentsDatabase.length} 个组件`);
+        // 构建组件映射提示词（包含组件映射、组件上下文、标记组件和完整组件数据库）
+        const componentMappingPrompt = buildComponentMappingPrompt(componentMappings, componentContexts, markedComponents, componentsDatabase);
         // 使用提示词（已包含默认值）
         return {
             content: [
@@ -435,7 +438,7 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
         .array(z.object({
         name: z.string().describe('Component name in PascalCase'),
         path: z.string().describe('Component file path relative to project root'),
-        signature: z.string().describe('Component signature (SHA256 hash) for matching'),
+        signature: z.string().optional().describe('Component Screenshot (SHA256 hash) for matching'),
         type: z.enum(['button', 'input', 'card', 'text', 'image', 'container', 'list', 'custom']).optional(),
         description: z.string().optional(),
         import: z.string().optional().describe('Import statement for the component'),
@@ -447,6 +450,22 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
             description: z.string().optional(),
         }))
             .optional(),
+        super: z.string().optional().describe('Parent class or base component name'),
+        functions: z
+            .array(z.object({
+            name: z.string().describe('Method or function name'),
+            params: z
+                .array(z.object({
+                name: z.string(),
+                type: z.string(),
+            }))
+                .optional()
+                .describe('Method parameters'),
+            returnType: z.string().optional().describe('Return type of the method'),
+            description: z.string().optional(),
+        }))
+            .optional()
+            .describe('Public methods or functions exposed by the component'),
     }))
         .describe('Array of components to mark and save'),
 }, async (args) => {
@@ -466,11 +485,11 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
         }
         // 2. 加载现有组件
         const existingComponents = await fileManager.loadComponentsDatabase();
-        // 3. 构建 signature 索引（用于去重）
-        const signatureIndex = new Map();
+        // 3. 构建 path 索引（用于去重，path 一致则认为是同一组件）
+        const pathIndex = new Map();
         existingComponents.forEach((comp, index) => {
-            if (comp.signature) {
-                signatureIndex.set(comp.signature, index);
+            if (comp.path) {
+                pathIndex.set(comp.path, index);
             }
         });
         // 4. 处理新组件（合并逻辑）
@@ -478,7 +497,8 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
         let addedCount = 0;
         let updatedCount = 0;
         for (const comp of components) {
-            const existingIndex = signatureIndex.get(comp.signature);
+            // 使用 path 判断组件是否已存在（组件冲突检测）
+            const existingIndex = pathIndex.get(comp.path);
             const storedComponent = {
                 id: generateComponentId(),
                 name: comp.name,
@@ -491,8 +511,14 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
                     required: p.required || false,
                     description: p.description,
                 })),
+                functions: (comp.functions || []).map((f) => ({
+                    name: f.name,
+                    params: (f.params || []).map((p) => ({ name: p.name, type: p.type })),
+                    returnType: f.returnType,
+                    description: f.description,
+                })),
+                super: comp.super,
                 description: comp.description,
-                signature: comp.signature,
             };
             if (existingIndex !== undefined) {
                 // 更新已存在的组件（保留原始导入时间）
@@ -506,7 +532,7 @@ mcpServer.tool('mark_components', 'Mark and save components to project component
             else {
                 // 添加新组件
                 existingComponents.push(storedComponent);
-                signatureIndex.set(comp.signature, existingComponents.length - 1);
+                pathIndex.set(comp.path, existingComponents.length - 1);
                 addedCount++;
             }
         }

package/dist/build/server.js

@@ -833,6 +833,10 @@ export async function startHttpServer(port = PORT, mcpServer, configManagerInsta
             });
         }
     });
+    // 多文件分析限制
+    const MAX_FILES = 10; // 最多 10 个文件
+    const MAX_TOTAL_CHARS = 40000; // 总内容最多 40000 字符
+    const MAX_FILE_CHARS = 5000; // 单文件最多 5000 字符
     /**
      * 分析项目中的组件
      */
@@ -846,10 +850,17 @@ export async function startHttpServer(port = PORT, mcpServer, configManagerInsta
                 });
                 return;
             }
-            Logger.log(`分析 ${filePaths.length} 个项目文件`);
+            // 限制文件数量
+            if (filePaths.length > MAX_FILES) {
+                res.status(400).json({
+                    success: false,
+                    message: `文件数量超过限制，最多支持 ${MAX_FILES} 个文件`,
+                });
+                return;
+            }
+            Logger.log(`批量分析 ${filePaths.length} 个项目文件`);
             const projectPath = getProjectRoot();
-            const results = [];
-            // 尝试加载保存的提示词设置（如果提供了 fileKey 和 nodeId）
+            // 尝试加载保存的提示词设置
             let savedPromptSetting = null;
             if (fileKey && nodeId) {
                 try {
@@ -862,148 +873,163 @@ export async function startHttpServer(port = PORT, mcpServer, configManagerInsta
             }
             const frameworkGuidePrompt = savedPromptSetting?.frameworkGuidePrompt;
             const _componentAnalysisPrompt = savedPromptSetting?.componentAnalysisPrompt || componentAnalysisPrompt;
-            // 读取并分析每个文件
+            // 读取所有文件内容
+            const fileContents = [];
+            let totalChars = 0;
             for (const filePath of filePaths) {
                 try {
                     const fullPath = path.join(projectPath, filePath);
                     // 安全检查：确保文件在项目目录内
                     if (!fullPath.startsWith(projectPath)) {
-                        results.push({
-                            success: false,
-                            filename: filePath,
+                        fileContents.push({
+                            path: filePath,
+                            content: '',
                             error: '无权访问该文件',
                         });
                         continue;
                     }
                     // 读取文件内容
-                    const content = await fs.promises.readFile(fullPath, 'utf-8');
-                    const filename = path.basename(filePath);
-                    // 使用 MCP Sampling 进行实际分析
-                    if (mcpServer) {
-                        try {
-                            // 构建提示词，替换占位符
-                            const prompt = _componentAnalysisPrompt.replace(/{filename}/g, filename).replace(/{fileContent}/g, content);
-                            // 调用 MCP Sampling API
-                            const { content: { text }, } = await mcpServer.server.createMessage({
-                                messages: [
-                                    frameworkGuidePrompt && {
-                                        role: 'user',
-                                        content: {
-                                            type: 'text',
-                                            text: frameworkGuidePrompt,
-                                        },
-                                    },
-                                    {
-                                        role: 'user',
-                                        content: {
-                                            type: 'text',
-                                            text: prompt,
-                                        },
-                                    },
-                                ].filter(Boolean),
-                                maxTokens: 8000,
-                            }, { timeout: 2 * 60 * 1000 });
-                            // 解析 AI 返回的 JSON
-                            const extractResult = extractJson(text);
-                            if (extractResult.state === 'successful-parse' && extractResult.value) {
-                                const analysisResult = extractResult.value;
-                                // 构建组件信息
-                                const component = {
-                                    id: generateComponentId(),
-                                    name: analysisResult.componentName || path.basename(filePath, path.extname(filePath)),
-                                    type: 'custom',
-                                    path: filePath,
-                                    import: analysisResult.import,
-                                    props: analysisResult.props || [],
-                                    description: analysisResult.description || '组件描述',
-                                };
-                                results.push({
-                                    success: true,
-                                    component,
-                                    filename: filePath,
-                                });
-                                Logger.log(`成功分析组件: ${filePath}, 组件名: ${component.name}`);
-                            }
-                            else {
-                                // JSON 解析失败，使用默认值
-                                Logger.warn(`解析组件分析结果失败: ${extractResult.error}, 文件: ${filePath}`);
-                                results.push({
-                                    success: true,
-                                    component: {
-                                        id: generateComponentId(),
-                                        name: path.basename(filePath, path.extname(filePath)),
-                                        type: 'custom',
-                                        path: filePath,
-                                        import: `import { ${path.basename(filePath, path.extname(filePath))} } from './${filePath}'`,
-                                        props: [],
-                                        description: '组件描述',
-                                    },
-                                    filename: filePath,
-                                });
-                            }
-                        }
-                        catch (samplingError) {
-                            Logger.error(`调用采样 API 失败: ${filePath}`, samplingError);
-                            // 采样失败时使用默认值
-                            results.push({
-                                success: true,
-                                component: {
-                                    id: generateComponentId(),
-                                    name: path.basename(filePath, path.extname(filePath)),
-                                    type: 'custom',
-                                    path: filePath,
-                                    import: `import { ${path.basename(filePath, path.extname(filePath))} } from './${filePath}'`,
-                                    props: [],
-                                    description: '组件描述',
-                                },
-                                filename: filePath,
-                            });
-                        }
+                    let content = await fs.promises.readFile(fullPath, 'utf-8');
+                    // 单文件截断
+                    if (content.length > MAX_FILE_CHARS) {
+                        content = content.slice(0, MAX_FILE_CHARS) + '\n// ... 内容已截断 ...';
+                        Logger.warn(`文件 ${filePath} 内容过长，已截断至 ${MAX_FILE_CHARS} 字符`);
                     }
-                    else {
-                        // MCP 服务器未初始化，使用默认值
-                        Logger.warn('MCP 服务器未初始化，使用默认组件信息');
-                        results.push({
-                            success: true,
-                            component: {
-                                id: generateComponentId(),
-                                name: path.basename(filePath, path.extname(filePath)),
-                                type: 'custom',
-                                path: filePath,
-                                import: `import { ${path.basename(filePath, path.extname(filePath))} } from './${filePath}'`,
-                                props: [],
-                                description: '组件描述',
-                            },
-                            filename: filePath,
+                    // 检查总字符数
+                    if (totalChars + content.length > MAX_TOTAL_CHARS) {
+                        Logger.warn(`总内容超过 ${MAX_TOTAL_CHARS} 字符限制，跳过文件: ${filePath}`);
+                        fileContents.push({
+                            path: filePath,
+                            content: '',
+                            error: '总内容超过限制，已跳过',
                         });
+                        continue;
                     }
+                    totalChars += content.length;
+                    fileContents.push({
+                        path: filePath,
+                        content,
+                    });
                 }
                 catch (error) {
                     Logger.error(`读取文件失败: ${filePath}`, error);
-                    results.push({
-                        success: false,
-                        filename: filePath,
+                    fileContents.push({
+                        path: filePath,
+                        content: '',
                         error: error instanceof Error ? error.message : String(error),
                     });
                 }
             }
-            const succeeded = results.filter((r) => r.success).length;
-            const failed = results.filter((r) => !r.success).length;
-            res.json({
-                success: true,
-                data: {
-                    total: filePaths.length,
-                    succeeded,
-                    failed,
-                    components: results.filter((r) => r.success).map((r) => r.component),
-                    errors: results
-                        .filter((r) => !r.success)
-                        .map((r) => ({
-                        filename: r.filename,
-                        error: r.error,
-                    })),
-                },
-            });
+            // 过滤出成功读取的文件
+            const validFiles = fileContents.filter((f) => f.content && !f.error);
+            const errorFiles = fileContents.filter((f) => f.error);
+            if (validFiles.length === 0) {
+                res.json({
+                    success: true,
+                    data: {
+                        total: filePaths.length,
+                        succeeded: 0,
+                        failed: errorFiles.length,
+                        components: [],
+                        errors: errorFiles.map((f) => ({ filename: f.path, error: f.error })),
+                    },
+                });
+                return;
+            }
+            // 构建多文件内容部分
+            const filesSection = validFiles
+                .map((f) => {
+                const ext = path.extname(f.path).slice(1) || 'txt';
+                return `### 文件：${f.path}\n\`\`\`${ext}\n${f.content}\n\`\`\``;
+            })
+                .join('\n\n');
+            // 构建最终 Prompt
+            const prompt = _componentAnalysisPrompt.replace('{filesSection}', filesSection);
+            Logger.log(`构建 Prompt 完成，总字符数: ${prompt.length}`);
+            // 调用 MCP Sampling API
+            if (!mcpServer) {
+                Logger.warn('MCP 服务器未初始化，返回空结果');
+                res.json({
+                    success: true,
+                    data: {
+                        total: filePaths.length,
+                        succeeded: 0,
+                        failed: filePaths.length,
+                        components: [],
+                        errors: filePaths.map((p) => ({ filename: p, error: 'MCP 服务器未初始化' })),
+                    },
+                });
+                return;
+            }
+            try {
+                const { content: { text }, } = await mcpServer.server.createMessage({
+                    messages: [
+                        frameworkGuidePrompt && {
+                            role: 'user',
+                            content: {
+                                type: 'text',
+                                text: frameworkGuidePrompt,
+                            },
+                        },
+                        {
+                            role: 'user',
+                            content: {
+                                type: 'text',
+                                text: prompt,
+                            },
+                        },
+                    ].filter(Boolean),
+                    maxTokens: 8000,
+                }, { timeout: 2 * 60 * 1000 });
+                // 解析 AI 返回的 JSON
+                const extractResult = extractJson(text);
+                if (extractResult.state === 'successful-parse' && extractResult.value) {
+                    const analysisResult = extractResult.value;
+                    const components = (analysisResult.components || []).map((comp) => ({
+                        id: generateComponentId(),
+                        name: comp.componentName || 'Unknown',
+                        type: 'custom',
+                        path: comp.path || '',
+                        import: comp.import || '',
+                        props: comp.props || [],
+                        description: comp.description || '',
+                        super: comp.super || undefined,
+                        functions: comp.functions || undefined,
+                    }));
+                    Logger.log(`成功分析 ${components.length} 个组件`);
+                    res.json({
+                        success: true,
+                        data: {
+                            total: filePaths.length,
+                            succeeded: validFiles.length,
+                            failed: errorFiles.length,
+                            components,
+                            errors: errorFiles.map((f) => ({ filename: f.path, error: f.error })),
+                        },
+                    });
+                }
+                else {
+                    Logger.warn(`解析组件分析结果失败: ${extractResult.error}`);
+                    res.json({
+                        success: true,
+                        data: {
+                            total: filePaths.length,
+                            succeeded: 0,
+                            failed: filePaths.length,
+                            components: [],
+                            errors: [{ filename: 'all', error: `AI 返回结果解析失败: ${extractResult.error}` }],
+                        },
+                    });
+                }
+            }
+            catch (samplingError) {
+                Logger.error('调用采样 API 失败:', samplingError);
+                res.status(500).json({
+                    success: false,
+                    message: '调用 Sampling 分析失败，请调用 #mark_components tool进行组件分析',
+                    error: samplingError instanceof Error ? samplingError.message : String(samplingError),
+                });
+            }
         }
         catch (error) {
             Logger.error('分析项目组件失败:', error);
@@ -1077,7 +1103,7 @@ export async function startHttpServer(port = PORT, mcpServer, configManagerInsta
             const { includePaths, excludePaths } = req.query;
             const projectPath = getProjectRoot();
             Logger.log('扫描项目组件:', { includePaths, excludePaths });
-            // 读取外部依赖组件（从 .sloth/components.json）
+            // 读取项目组件（从 .sloth/components.json）
             let projectComponents = [];
             const slothPath = path.join(projectPath, '.sloth', 'components.json');
             const fs = await import('fs/promises');

package/dist/interceptor-web/dist/build-report.json

@@ -1,18 +1,18 @@
 {
-  "buildTime": "2025-12-06T13:27:37.588Z",
+  "buildTime": "2025-12-19T16:46:24.638Z",
   "mode": "build",
   "pages": {
     "main": {
       "file": "index.html",
-      "size": 1600710,
+      "size": 1604164,
       "sizeFormatted": "1.53 MB"
     },
     "detail": {
       "file": "detail.html",
-      "size": 280523,
-      "sizeFormatted": "273.95 KB"
+      "size": 280955,
+      "sizeFormatted": "274.37 KB"
     }
   },
-  "totalSize": 1881233,
-  "totalSizeFormatted": "1.79 MB"
+  "totalSize": 1885119,
+  "totalSizeFormatted": "1.8 MB"
 }