@blocklet/pages-kit-block-studio 0.6.0 → 0.6.2

package/lib/esm/plugins/vite-plugin-code-splitter.js

@@ -1,188 +1,235 @@
-import fs from 'fs';
-import path from 'path';
+/**
+ * Vite Plugin: Component Code Splitter
+ *
+ * 🚀 WORKFLOW OVERVIEW:
+ *
+ * ┌─────────────────────────────────────────────────────────────────┐
+ * │                    PLUGIN 1: CODE SPLITTER                     │
+ * └─────────────────────────────────────────────────────────────────┘
+ *
+ * 📋 Phase 1: Config Stage
+ * ├── Analyze entry files to find all exports
+ * ├── Detect: default, EditComponent, PropertiesSchema, GetServerSideProps
+ * └── Create separate entry points for each export:
+ *     • Component → Component?exportName=default&target=browser
+ *     • EditComponent → Component_EditComponent?exportName=EditComponent&target=browser
+ *     • GetServerSideProps → Component_GetServerSideProps?exportName=GetServerSideProps&target=node
+ *
+ * 🔄 Phase 2: Resolve & Load Stage
+ * ├── resolveId: Identify virtual modules with ?exportName= params
+ * └── load: Transform code and split exports
+ *     ├── Use esbuild for fast transformation
+ *     ├── Apply tree-shaking to remove unused code
+ *     └── Filter to keep only specified exports
+ *
+ * ┌─────────────────────────────────────────────────────────────────┐
+ * │                PLUGIN 2: POST-BUILD PROCESSING                 │
+ * └─────────────────────────────────────────────────────────────────┘
+ *
+ * 🔧 Phase 3: Post-Build Optimization
+ * ├── Scan generated files and classify by target:
+ * │   ├── Node.js Target: GetServerSideProps functions
+ * │   └── Browser Target: Components, EditComponents, Schemas
+ * ├── Node.js files: Re-bundle with esbuild (platform: node, format: cjs)
+ * ├── Browser files: Transpile with TypeScript + builtin module transformer
+ * └── Generate dependency mapping (chunks-map.json)
+ *
+ * 💡 WHY THIS DESIGN:
+ * • Reduces bundle size by splitting unused exports
+ * • Optimizes for different runtime environments (browser vs node)
+ * • Enables selective loading in Component Studio
+ * • Maintains clean separation between edit-time and runtime code
+ */
+import { BuiltinModules } from '@blocklet/pages-kit/utils/builtin';
+import { createBuiltinModuleTransformer } from '@blocklet/pages-kit/utils/typescript/builtin-module-transformer';
+// @ts-ignore
+import { analyzeFileChunks } from '@blocklet/pages-kit/utils/typescript/chunks-analyzer-transformer';
+import * as esbuild from 'esbuild';
+import fs, { readFileSync, existsSync, mkdirSync, writeFileSync, readdirSync, statSync } from 'fs';
+import pLimit from 'p-limit';
+import path, { basename } from 'path';
 import ts from 'typescript';
 import { EDIT_COMPONENT_FILE_NAME_REGEX } from '../constants';
-import { EDIT_COMPONENT_NAME, getEditComponentBlockName, logger } from '../utils/helper';
+import { EDIT_COMPONENT_NAME, getEditComponentBlockName, logger, PROPERTIES_SCHEMA_NAME, AIGNE_OUTPUT_VALUE_SCHEMA_NAME, GET_SERVER_SIDE_PROPS_NAME, getPropertiesSchemaBlockName, getAigneOutputValueSchemaBlockName, getGetServerSidePropsBlockName, } from '../utils/helper';
+const minify = true;
+/**
+ * 导出配置
+ */
+const EXPORT_CONFIGS = [
+    {
+        exportName: 'default',
+        getBlockName: (key) => `${key}`,
+        description: 'Default',
+        supportSeparateFile: false,
+        target: 'browser',
+        external: [],
+    },
+    // {
+    //   exportName: 'default',
+    //   getBlockName: (key) => `${key}(default)`,
+    //   description: 'Default CJS',
+    //   supportSeparateFile: false,
+    //   target: 'node',
+    //   external: [],
+    // },
+    {
+        exportName: EDIT_COMPONENT_NAME,
+        getBlockName: getEditComponentBlockName,
+        description: 'EditComponent',
+        supportSeparateFile: true, // 支持独立的 @edit-component 文件
+        target: 'browser', // 前端组件
+        external: [],
+    },
+    {
+        exportName: PROPERTIES_SCHEMA_NAME,
+        getBlockName: getPropertiesSchemaBlockName,
+        description: 'PropertiesSchema',
+        supportSeparateFile: false,
+        target: 'browser', // 前端 schema
+        external: [],
+    },
+    {
+        exportName: AIGNE_OUTPUT_VALUE_SCHEMA_NAME,
+        getBlockName: getAigneOutputValueSchemaBlockName,
+        description: 'AigneOutputValueSchema',
+        supportSeparateFile: false,
+        target: 'browser', // 前端 schema
+        external: [],
+    },
+    {
+        exportName: GET_SERVER_SIDE_PROPS_NAME,
+        getBlockName: getGetServerSidePropsBlockName,
+        description: 'GetServerSideProps',
+        supportSeparateFile: false,
+        target: 'node', // 服务端函数
+        format: 'esm', // esm 格式
+        // 排除的依赖, 需要跟后端保持一致
+        external: [...Object.keys(BuiltinModules)],
+    },
+];
 /**
- * 分析组件文件结构
- * @param sourceFile TypeScript源文件
+ * 分析组件文件中的所有导出
  */
-function analyzeComponent(sourceFile) {
-    const result = {};
-    // 访问AST节点
+function analyzeAllExports(sourceFile) {
+    const result = {
+        namedExports: new Map(),
+        exportDeclarations: [],
+    };
     function visit(node) {
-        // 找到默认导出
-        if (ts.isExportAssignment(node)) {
-            result.defaultExport = {
-                pos: node.pos,
-                end: node.end,
-            };
+        // 默认导出 - export default xxx
+        if (ts.isExportAssignment(node) && !node.isExportEquals) {
+            result.defaultExport = { pos: node.pos, end: node.end };
         }
-        // 检查函数声明的默认导出
+        // 函数声明的默认导出 - export default function
         if (ts.isFunctionDeclaration(node) && node.modifiers) {
             const isExport = node.modifiers.some((m) => m.kind === ts.SyntaxKind.ExportKeyword);
             const isDefault = node.modifiers.some((m) => m.kind === ts.SyntaxKind.DefaultKeyword);
             if (isExport && isDefault) {
-                result.defaultExport = {
-                    pos: node.pos,
-                    end: node.end,
-                };
+                result.defaultExport = { pos: node.pos, end: node.end };
             }
-            // 检查导出的 EditComponent 函数声明
-            if (isExport && !isDefault && node.name && node.name.text === EDIT_COMPONENT_NAME) {
-                result.editComponent = {
-                    pos: node.pos,
-                    end: node.end,
-                };
+            else if (isExport && !isDefault && node.name) {
+                // 命名导出的函数 - export function xxx
+                result.namedExports.set(node.name.text, { pos: node.pos, end: node.end });
             }
         }
-        // 检查类声明的导出
+        // 类声明的导出
         if (ts.isClassDeclaration(node) && node.modifiers) {
             const isExport = node.modifiers.some((m) => m.kind === ts.SyntaxKind.ExportKeyword);
-            // 检查导出的 EditComponent 类声明
-            if (isExport && node.name && node.name.text === EDIT_COMPONENT_NAME) {
-                result.editComponent = {
-                    pos: node.pos,
-                    end: node.end,
-                };
+            if (isExport && node.name) {
+                result.namedExports.set(node.name.text, { pos: node.pos, end: node.end });
             }
         }
-        // 找到命名导出 - EditComponent
+        // 变量声明的导出 - export const xxx
         if (ts.isVariableStatement(node) && node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) {
             const { declarations } = node.declarationList;
             for (const decl of declarations) {
-                if (ts.isIdentifier(decl.name) && decl.name.text === EDIT_COMPONENT_NAME) {
-                    result.editComponent = {
-                        pos: node.pos,
-                        end: node.end,
-                    };
-                    break;
-                }
-            }
-        }
-        // 检查导出声明
-        if (ts.isExportDeclaration(node) && node.exportClause) {
-            if (ts.isNamedExports(node.exportClause)) {
-                // 检查普通导出 export { EditComponent }
-                const hasEditComponent = node.exportClause.elements.some((element) => ts.isExportSpecifier(element) && element.name.text === EDIT_COMPONENT_NAME);
-                // 检查重命名导出 export { SomeComponent as EditComponent }
-                const hasRenamedEditComponent = node.exportClause.elements.some((element) => ts.isExportSpecifier(element) && element.propertyName && element.name.text === EDIT_COMPONENT_NAME);
-                if (hasEditComponent || hasRenamedEditComponent) {
-                    result.editComponent = {
-                        pos: node.pos,
-                        end: node.end,
-                    };
+                if (ts.isIdentifier(decl.name)) {
+                    result.namedExports.set(decl.name.text, { pos: node.pos, end: node.end });
                 }
             }
         }
-        // 处理导出的箭头函数/函数表达式
-        if (ts.isVariableStatement(node)) {
-            const { declarations } = node.declarationList;
-            for (const decl of declarations) {
-                if (ts.isIdentifier(decl.name) && decl.name.text === EDIT_COMPONENT_NAME) {
-                    if (node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) {
-                        result.editComponent = {
-                            pos: node.pos,
-                            end: node.end,
-                        };
-                        break;
+        // 导出声明 - export { xxx, yyy }
+        if (ts.isExportDeclaration(node)) {
+            result.exportDeclarations.push({ pos: node.pos, end: node.end });
+            if (node.exportClause && ts.isNamedExports(node.exportClause)) {
+                // 记录这个导出声明包含的所有导出名
+                node.exportClause.elements.forEach((element) => {
+                    if (ts.isExportSpecifier(element)) {
+                        const exportName = element.propertyName ? element.name.text : element.name.text;
+                        result.namedExports.set(exportName, { pos: node.pos, end: node.end });
                     }
-                }
+                });
             }
         }
-        // 递归处理所有子节点
         ts.forEachChild(node, visit);
     }
-    // 开始遍历
     visit(sourceFile);
     return result;
 }
 /**
- * 转换代码，使用TypeScript编译器API
+ * 解析 exportName 参数
  */
-function transformCode(code, renderType) {
-    // 创建源文件
-    const sourceFile = ts.createSourceFile('temp.tsx', code, ts.ScriptTarget.Latest, true);
-    // 分析源代码结构
-    const analysis = analyzeComponent(sourceFile);
-    if (renderType === 'view') {
-        // 移除 EditComponent
-        if (analysis.editComponent) {
-            // 根据位置替换为空内容
-            const beforeEdit = code.substring(0, analysis.editComponent.pos);
-            const afterEdit = code.substring(analysis.editComponent.end);
-            return beforeEdit + afterEdit;
-        }
-    }
-    else if (renderType === 'setting') {
-        // 移除或替换默认导出，直接导出EditComponent
-        if (analysis.defaultExport && analysis.editComponent) {
-            // 编辑模式，保持命名导出，但让EditComponent同时也作为默认导出
-            const defaultExport = `
-// Export EditComponent as both named export and default
-export { ${EDIT_COMPONENT_NAME} as default };
-`;
-            const beforeDefault = code.substring(0, analysis.defaultExport.pos);
-            const afterDefault = code.substring(analysis.defaultExport.end);
-            // 替换默认导出为EditComponent
-            return beforeDefault + defaultExport + afterDefault;
-        }
-    }
-    // 如果没有进行修改，返回原始代码
-    return code;
+function parseExportNames(exportNameParam) {
+    return exportNameParam
+        .split(',')
+        .map((name) => name.trim())
+        .filter(Boolean);
 }
 /**
- * 进一步增强版本：通过完整的AST转换
+ * 转换代码，只保留指定的导出
  */
-function transformCodeWithPrinter(code, renderType) {
+function transformCodeWithExports(code, exportNames) {
     try {
-        // 创建源文件
         const sourceFile = ts.createSourceFile('temp.tsx', code, ts.ScriptTarget.Latest, true);
-        // 创建转换器上下文
+        // 标准化导出名称（default 处理）
+        const normalizedExportNames = new Set(exportNames.map((name) => (name === 'default' ? 'default' : name)));
         const transformerFactory = (context) => {
             return (sourceFile) => {
-                // 访问并转换节点
                 const visitor = (node) => {
-                    // view模式：移除EditComponent相关代码
-                    if (renderType === 'view') {
-                        // 移除 export const EditComponent 声明
-                        if (ts.isVariableStatement(node) && node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) {
-                            const { declarations } = node.declarationList;
-                            if (declarations.some((d) => ts.isIdentifier(d.name) && d.name.text === EDIT_COMPONENT_NAME)) {
-                                return ts.factory.createEmptyStatement();
-                            }
+                    // 处理默认导出
+                    if (ts.isExportAssignment(node) && !node.isExportEquals) {
+                        return normalizedExportNames.has('default') ? node : ts.factory.createEmptyStatement();
+                    }
+                    // 处理函数/类的默认导出
+                    if (ts.isFunctionDeclaration(node) && node.modifiers) {
+                        const isExport = node.modifiers.some((m) => m.kind === ts.SyntaxKind.ExportKeyword);
+                        const isDefault = node.modifiers.some((m) => m.kind === ts.SyntaxKind.DefaultKeyword);
+                        if (isExport && isDefault) {
+                            return normalizedExportNames.has('default') ? node : ts.factory.createEmptyStatement();
                         }
-                        // 移除 export { EditComponent } 形式的导出
-                        if (ts.isExportDeclaration(node) && node.exportClause && ts.isNamedExports(node.exportClause)) {
-                            const { elements } = node.exportClause;
-                            if (elements.some((e) => ts.isExportSpecifier(e) && e.name.text === EDIT_COMPONENT_NAME)) {
-                                // 如果只有EditComponent一个导出，就完全移除
-                                if (elements.length === 1) {
-                                    return ts.factory.createEmptyStatement();
-                                }
-                                // 否则创建新的导出声明，但不包含EditComponent
-                                const newElements = elements.filter((e) => !(ts.isExportSpecifier(e) && e.name.text === EDIT_COMPONENT_NAME));
-                                return ts.factory.createExportDeclaration(node.modifiers, node.isTypeOnly, ts.factory.createNamedExports(newElements), node.moduleSpecifier);
-                            }
+                        if (isExport && !isDefault && node.name) {
+                            return normalizedExportNames.has(node.name.text) ? node : ts.factory.createEmptyStatement();
                         }
                     }
-                    // setting模式：直接导出EditComponent
-                    if (renderType === 'setting') {
-                        // 找到默认导出节点进行替换
-                        if (ts.isExportAssignment(node) && node.isExportEquals === false) {
-                            // 替换 export default xxx 形式为 export { EditComponent as default }
-                            return ts.factory.createExportDeclaration(undefined, false, ts.factory.createNamedExports([
-                                ts.factory.createExportSpecifier(false, ts.factory.createIdentifier(EDIT_COMPONENT_NAME), ts.factory.createIdentifier('default')),
-                            ]));
+                    // 处理类声明的导出
+                    if (ts.isClassDeclaration(node) && node.modifiers) {
+                        const isExport = node.modifiers.some((m) => m.kind === ts.SyntaxKind.ExportKeyword);
+                        if (isExport && node.name) {
+                            return normalizedExportNames.has(node.name.text) ? node : ts.factory.createEmptyStatement();
                         }
-                        // 处理 export default function Xxx() {} 形式
-                        if (ts.isFunctionDeclaration(node) &&
-                            node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword) &&
-                            node.modifiers?.some((m) => m.kind === ts.SyntaxKind.DefaultKeyword)) {
-                            // 创建新的默认导出，导出EditComponent作为default
-                            return ts.factory.createExportDeclaration(undefined, false, ts.factory.createNamedExports([
-                                ts.factory.createExportSpecifier(false, ts.factory.createIdentifier(EDIT_COMPONENT_NAME), ts.factory.createIdentifier('default')),
-                            ]));
+                    }
+                    // 处理变量声明的导出
+                    if (ts.isVariableStatement(node) && node.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) {
+                        const { declarations } = node.declarationList;
+                        const shouldKeep = declarations.some((decl) => ts.isIdentifier(decl.name) && normalizedExportNames.has(decl.name.text));
+                        return shouldKeep ? node : ts.factory.createEmptyStatement();
+                    }
+                    // 处理导出声明 - export { xxx, yyy }
+                    if (ts.isExportDeclaration(node) && node.exportClause && ts.isNamedExports(node.exportClause)) {
+                        const { elements } = node.exportClause;
+                        const keptElements = elements.filter((element) => {
+                            if (ts.isExportSpecifier(element)) {
+                                const exportName = element.propertyName ? element.name.text : element.name.text;
+                                return normalizedExportNames.has(exportName);
+                            }
+                            return false;
+                        });
+                        if (keptElements.length === 0) {
+                            return ts.factory.createEmptyStatement();
+                        }
+                        if (keptElements.length < elements.length) {
+                            // 创建新的导出声明，只包含需要保留的导出
+                            return ts.factory.createExportDeclaration(node.modifiers, node.isTypeOnly, ts.factory.createNamedExports(keptElements), node.moduleSpecifier);
                         }
                     }
                     return ts.visitEachChild(node, visitor, context);
@@ -195,10 +242,9 @@ function transformCodeWithPrinter(code, renderType) {
         const printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
         if (result.transformed.length > 0) {
             const transformedSourceFile = result.transformed[0];
-            // TypeScript 类型保证
             if (transformedSourceFile) {
                 const transformedCode = printer.printFile(transformedSourceFile);
-                result.dispose(); // 清理资源
+                result.dispose();
                 return transformedCode;
             }
         }
@@ -206,40 +252,68 @@ function transformCodeWithPrinter(code, renderType) {
         return code;
     }
     catch (error) {
-        logger.error('Error transforming with printer:', error);
-        // 如果高级转换失败，回退到简单转换
-        return transformCode(code, renderType);
+        logger.error('Error transforming with exports:', error);
+        return code;
     }
 }
 /**
- * 检查文件是否包含EditComponent导出
+ * 简单的代码转换，通过字符串替换（fallback）
  */
-function hasEditComponentExportInEntryFile(filePath) {
+function transformCodeSimple(code, exportNames) {
+    const sourceFile = ts.createSourceFile('temp.tsx', code, ts.ScriptTarget.Latest, true);
+    const analysis = analyzeAllExports(sourceFile);
+    const normalizedExportNames = new Set(exportNames.map((name) => (name === 'default' ? 'default' : name)));
+    let result = code;
+    const toRemove = [];
+    // 收集需要移除的节点
+    if (analysis.defaultExport && !normalizedExportNames.has('default')) {
+        toRemove.push(analysis.defaultExport);
+    }
+    analysis.namedExports.forEach((range, name) => {
+        if (!normalizedExportNames.has(name)) {
+            toRemove.push(range);
+        }
+    });
+    // 按位置倒序排列，避免位置偏移
+    toRemove.sort((a, b) => b.pos - a.pos);
+    // 移除不需要的导出
+    for (const range of toRemove) {
+        const before = result.substring(0, range.pos);
+        const after = result.substring(range.end);
+        result = before + after;
+    }
+    return result;
+}
+/**
+ * 获取文件中的所有导出名称
+ */
+function getFileExports(filePath) {
     try {
         if (!fs.existsSync(filePath)) {
-            return false;
+            return [];
         }
-        // 读取文件内容
         const content = fs.readFileSync(filePath, 'utf-8');
-        // 创建源文件
         const sourceFile = ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, true);
-        // 使用已有的analyzeComponent函数分析
-        const analysis = analyzeComponent(sourceFile);
-        // 如果存在EditComponent导出，则返回true
-        return !!analysis.editComponent;
+        const analysis = analyzeAllExports(sourceFile);
+        const exports = [];
+        if (analysis.defaultExport) {
+            exports.push('default');
+        }
+        exports.push(...Array.from(analysis.namedExports.keys()));
+        return exports;
     }
     catch (error) {
-        logger.warn(`Error checking EditComponent in ${filePath}:`, error);
-        return false;
+        logger.warn(`Error analyzing exports in ${filePath}:`, error);
+        return [];
     }
 }
-// 检查目录中是否存在@edit-component文件
+/**
+ * 检查目录中是否存在@edit-component文件
+ */
 function findEditComponentFileInDir(filePath) {
     const dirPath = path.dirname(filePath);
-    // 获取目录中的所有文件
     try {
         const files = fs.readdirSync(dirPath);
-        // 检查是否有匹配的文件
         const file = files.find((file) => EDIT_COMPONENT_FILE_NAME_REGEX.test(file));
         if (file) {
             return path.join(dirPath, file);
@@ -252,105 +326,346 @@ function findEditComponentFileInDir(filePath) {
     }
 }
 /**
- * Vite 插件：组件代码拆分器
- * 用于自动将组件文件拆分为视图组件和编辑组件
+ * 🎯 MAIN EXPORT: Vite Plugin Factory
+ * Creates two plugins that work together to split and optimize component code
  */
-export function vitePluginCodeSplitter() {
-    return {
-        name: 'vite-plugin-code-splitter',
-        config(config) {
-            // 只有在构建模式且lib配置存在时处理
-            if (config.build && config.build.lib && typeof config.build.lib === 'object') {
-                const libConfig = config.build.lib;
-                if (libConfig.entry && typeof libConfig.entry === 'object' && !Array.isArray(libConfig.entry)) {
-                    // 创建新的入口列表
-                    const newEntry = {};
-                    Object.entries(libConfig.entry).forEach(([key, filePath]) => {
-                        // 对于普通模块路径，添加URL参数
-                        if (typeof filePath === 'string') {
-                            let editComponentFilePath = null;
-                            // 检测文件是否包含EditComponent
-                            let hasEditComponent = false;
-                            try {
-                                // 使用TypeScript分析文件
-                                hasEditComponent = hasEditComponentExportInEntryFile(filePath);
-                                // 记录检测到的文件
-                                const fileName = path.basename(filePath);
-                                if (hasEditComponent) {
-                                    logger.info(`Found EditComponent in ${fileName}`);
-                                    editComponentFilePath = filePath;
+export function vitePluginCodeSplitter(options) {
+    const formats = options?.formats || ['es', 'cjs'];
+    const transpileBuiltinModule = options?.transpileBuiltinModule ?? true;
+    const skipBundleNodeTarget = options?.skipBundleNodeTarget ?? false;
+    return [
+        // 🔧 PLUGIN 1: CODE SPLITTER & TRANSFORMER
+        {
+            name: 'vite-plugin-code-splitter',
+            /**
+             * 📋 PHASE 1: CONFIG STAGE
+             * Analyzes entry files and creates separate entry points for each export type
+             */
+            config(config) {
+                if (config.build && config.build.lib && typeof config.build.lib === 'object') {
+                    const libConfig = config.build.lib;
+                    if (libConfig.entry && typeof libConfig.entry === 'object' && !Array.isArray(libConfig.entry)) {
+                        const newEntry = {};
+                        Object.entries(libConfig.entry).forEach(([key, filePath]) => {
+                            if (typeof filePath === 'string') {
+                                try {
+                                    // 分析文件中的所有导出
+                                    const exports = getFileExports(filePath);
+                                    const fileName = path.basename(filePath);
+                                    logger.info(`Found exports in ${fileName}: ${exports.join(', ')}`);
+                                    // 处理所有配置的导出类型
+                                    EXPORT_CONFIGS.forEach(({ exportName, getBlockName, description, supportSeparateFile, target }) => {
+                                        if (exports.includes(exportName)) {
+                                            newEntry[getBlockName(key)] = `${filePath}?exportName=${exportName}&target=${target}`;
+                                            logger.debug(`Added ${description} entry for ${fileName} (target: ${target})`);
+                                        }
+                                        else if (supportSeparateFile && exportName === EDIT_COMPONENT_NAME) {
+                                            // 检查是否有独立的 @edit-component 文件
+                                            const editComponentFile = findEditComponentFileInDir(filePath);
+                                            if (editComponentFile) {
+                                                const editExports = getFileExports(editComponentFile);
+                                                if (editExports.includes(EDIT_COMPONENT_NAME)) {
+                                                    newEntry[getEditComponentBlockName(key)] =
+                                                        `${editComponentFile}?exportName=${EDIT_COMPONENT_NAME}&target=${target}`;
+                                                    logger.info(`Found separate @edit-component file for ${path.basename(editComponentFile)} (target: ${target})`);
+                                                }
+                                            }
+                                        }
+                                    });
                                 }
-                                else {
-                                    logger.debug(`No EditComponent found in ${fileName}`);
-                                    editComponentFilePath = findEditComponentFileInDir(filePath);
-                                    // 检查是否存在独立的@edit-component文件
-                                    if (editComponentFilePath) {
-                                        hasEditComponent = true;
-                                        logger.info(`Found separate @edit-component file for ${editComponentFilePath}`);
-                                    }
+                                catch (err) {
+                                    logger.warn(`Failed to analyze exports in ${filePath}: ${err}`);
+                                    // fallback 到原始文件
+                                    newEntry[key] = filePath;
                                 }
                             }
-                            catch (err) {
-                                logger.warn(`Failed to check EditComponent in ${filePath}: ${err}`);
-                            }
-                            // 视图组件总是保留
-                            newEntry[key] = `${filePath}?renderType=view`;
-                            // 只为包含EditComponent的文件创建编辑入口
-                            if (hasEditComponent) {
-                                newEntry[getEditComponentBlockName(key)] = `${editComponentFilePath}?renderType=setting`;
-                            }
-                        }
-                    });
-                    // 更新配置
-                    libConfig.entry = newEntry;
-                    logger.info('Auto-split components enabled, entries updated');
+                        });
+                        libConfig.entry = newEntry;
+                        logger.info('Auto-split components enabled with export-based splitting');
+                    }
                 }
-            }
-            return config;
-        },
-        resolveId(id) {
-            // 处理带有 renderType 参数的模块 ID
-            if (id.includes('?renderType=')) {
-                return id; // 标记为需要处理的虚拟模块
-            }
-            return null;
-        },
-        load(id) {
-            if (!id.includes('?renderType=')) {
-                return null;
-            }
-            try {
-                // 解析 id，提取文件路径和查询参数
-                const [filePath, query] = id.split('?');
-                const params = new URLSearchParams(query);
-                const renderType = params.get('renderType');
-                if (!filePath || !renderType || (renderType !== 'view' && renderType !== 'setting')) {
-                    return null;
+                return config;
+            },
+            /**
+             * 🔍 PHASE 2A: RESOLVE STAGE
+             * Identifies virtual modules with exportName parameters
+             */
+            resolveId(id) {
+                if (id.includes('?exportName=')) {
+                    return id; // Mark as resolved to trigger load() for this virtual module
                 }
-                // 确保文件存在
-                if (!fs.existsSync(filePath)) {
-                    logger.error(`File not found: ${filePath}`);
+                return null;
+            },
+            /**
+             * 🔄 PHASE 2B: LOAD & TRANSFORM STAGE
+             * Loads and transforms code, keeping only specified exports
+             */
+            async load(id) {
+                if (!id.includes('?exportName=')) {
                     return null;
                 }
-                // 读取文件内容
-                const code = fs.readFileSync(filePath, 'utf-8');
-                // 根据渲染类型进行代码转换
-                // logger.info(`Splitting code for ${renderType}: ${filePath}`);
                 try {
-                    // 首先尝试使用高级转换
-                    return transformCodeWithPrinter(code, renderType);
+                    const [filePath, query] = id.split('?');
+                    const params = new URLSearchParams(query);
+                    const exportNameParam = params.get('exportName');
+                    const target = params.get('target') || 'browser';
+                    if (!filePath || !exportNameParam) {
+                        return null;
+                    }
+                    if (!fs.existsSync(filePath)) {
+                        logger.error(`File not found: ${filePath}`);
+                        return null;
+                    }
+                    const exportNames = parseExportNames(exportNameParam);
+                    logger.debug(`Processing exports [${exportNames.join(', ')}] with esbuild for: ${path.basename(filePath)} (target: ${target})`);
+                    try {
+                        // Use esbuild for transform + tree-shaking in one step
+                        const result = await esbuild.transform(transformCodeWithExports(fs.readFileSync(filePath, 'utf-8'), exportNames), {
+                            loader: path.extname(filePath).slice(1), // .tsx -> tsx
+                            target: target === 'node' ? 'node18' : 'es2020',
+                            platform: target === 'node' ? 'node' : 'browser',
+                            format: 'esm',
+                            jsx: 'automatic',
+                            treeShaking: true,
+                            minify,
+                            sourcemap: false,
+                        });
+                        const transformedCode = result.code;
+                        return transformedCode;
+                    }
+                    catch (esbuildError) {
+                        logger.warn(`esbuild transform failed, falling back to TypeScript transform: ${esbuildError}`);
+                        // Fallback to original method
+                        const code = fs.readFileSync(filePath, 'utf-8');
+                        try {
+                            return transformCodeWithExports(code, exportNames);
+                        }
+                        catch (transformError) {
+                            logger.warn(`TypeScript transform also failed, using simple transform: ${transformError}`);
+                            return transformCodeSimple(code, exportNames);
+                        }
+                    }
                 }
-                catch (transformError) {
-                    logger.warn(`Advanced transform failed, falling back to basic transform: ${transformError}`);
-                    // 如果失败，回退到基本转换
-                    return transformCode(code, renderType);
+                catch (error) {
+                    logger.error(`Error processing module ${id}:`, error);
                 }
-            }
-            catch (error) {
-                logger.error(`Error processing module ${id}:`, error);
-            }
-            return null;
+                return null;
+            },
         },
-    };
+        // 🛠️ PLUGIN 2: POST-BUILD PROCESSOR
+        {
+            name: 'vite-plugin-code-splitter-post-build',
+            apply: 'build',
+            enforce: 'post',
+            /**
+             * 🔧 PHASE 3: POST-BUILD OPTIMIZATION
+             * Processes generated files based on their target environment
+             */
+            async writeBundle(options) {
+                if (!transpileBuiltinModule) {
+                    logger.info('Transpile builtin module is disabled, skipping post-build processing');
+                    return;
+                }
+                // 用于存储每个格式的 chunks 映射
+                const allChunksMap = {};
+                const getExportConfig = (fileName) => {
+                    // Extract export type from filename pattern: Component(ExportType).js
+                    const match = fileName.match(/\(([^)]+)\)\.js$/);
+                    if (!match || !match[1]) {
+                        return null; // Regular component file, defaults to browser
+                    }
+                    const exportName = match[1];
+                    return EXPORT_CONFIGS.find((config) => config.exportName === exportName || config.exportName.toLowerCase().includes(exportName.toLowerCase()));
+                };
+                /**
+                 * 🎯 FILE TYPE CLASSIFIER
+                 * Determines if a generated file should be treated as Node.js target
+                 * Examples: Timeline(getServerSideProps).js → Node.js target
+                 *          Timeline.js → Browser target
+                 */
+                const isNodeTargetFile = (fileName) => {
+                    // Look up target environment in EXPORT_CONFIGS
+                    const config = getExportConfig(fileName);
+                    return config?.target === 'node';
+                };
+                // 收集所有 Node.js 目标文件，准备重新构建
+                const nodeTargetFiles = [];
+                // 扫描构建输出，找到 Node.js 目标文件
+                const scanForNodeFiles = (dir) => {
+                    const files = readdirSync(dir);
+                    files.forEach((file) => {
+                        const filePath = path.join(dir, file);
+                        const stats = statSync(filePath);
+                        if (stats.isDirectory()) {
+                            scanForNodeFiles(filePath); // 递归处理子目录
+                        }
+                        else if (file.endsWith('.js') && isNodeTargetFile(file)) {
+                            logger.debug(`Found Node.js target file: ${file}, external: ${getExportConfig(file)?.external?.length ?? 0}`);
+                            nodeTargetFiles.push({
+                                filePath,
+                                external: getExportConfig(file)?.external || [],
+                                format: getExportConfig(file)?.format,
+                            });
+                        }
+                    });
+                };
+                formats.forEach((format) => {
+                    const formatDir = path.resolve(options.dir || 'dist', `${format}`);
+                    if (existsSync(formatDir)) {
+                        scanForNodeFiles(formatDir);
+                    }
+                });
+                // 如果有 Node.js 目标文件，为它们额外触发 Vite build
+                if (nodeTargetFiles.length > 0) {
+                    logger.info(`Found ${nodeTargetFiles.length} Node.js target files, triggering clean Vite build...`);
+                    await Promise.all(nodeTargetFiles.map(async ({ filePath, external, format }) => {
+                        try {
+                            const fileName = path.basename(filePath, '.js');
+                            logger.debug(`Rebuilding Node.js target file: ${fileName}`);
+                            // 使用 esbuild 进行单文件打包
+                            const result = await esbuild.build({
+                                entryPoints: [filePath],
+                                bundle: !skipBundleNodeTarget, // 是否打包所有依赖
+                                platform: 'node', // Node.js 平台
+                                format: format ?? 'cjs', // CommonJS 格式
+                                target: 'node18', // Node.js 目标版本
+                                outfile: filePath, // 直接覆盖原文件
+                                allowOverwrite: true, // 允许覆盖输入文件
+                                external: external ?? [], // 排除的依赖
+                                minify, // 可减少 50-70% 大小
+                                treeShaking: true, // 去除未使用代码
+                                sourcemap: false, // 不生成 sourcemap
+                                write: true, // 直接写入文件
+                                logLevel: 'error', // 只显示错误
+                                // 解析 JSX 和 TypeScript
+                                loader: {
+                                    '.tsx': 'tsx',
+                                    '.ts': 'ts',
+                                    '.jsx': 'jsx',
+                                    '.js': 'js',
+                                },
+                            });
+                            if (result.errors.length === 0) {
+                                logger.info(`Successfully rebuilt ${fileName} as single CJS file using esbuild`);
+                            }
+                            else {
+                                logger.error(`esbuild errors for ${fileName}:`, result.errors);
+                            }
+                        }
+                        catch (error) {
+                            logger.error(`Failed to rebuild Node.js target file ${filePath}:`, error);
+                        }
+                    }));
+                }
+                // 对生成的 JavaScript 文件进行 transpileModule 处理
+                const transpileBuiltinModuleFn = (dir, format) => {
+                    const files = readdirSync(dir);
+                    files.forEach((file) => {
+                        const filePath = path.join(dir, file);
+                        const stats = statSync(filePath);
+                        if (stats.isDirectory()) {
+                            transpileBuiltinModuleFn(filePath, format); // 递归处理子目录
+                        }
+                        else if (file.endsWith('.js')) {
+                            try {
+                                // 跳过 node target 文件的 transpile
+                                if (isNodeTargetFile(file)) {
+                                    logger.info(`Skipping transpile for Node.js target file: ${file}`);
+                                    return;
+                                }
+                                const script = readFileSync(filePath, 'utf8');
+                                // @ts-ignore
+                                const chunks = analyzeFileChunks(ts, script);
+                                // ensure chunksMap is with all chunks
+                                allChunksMap[basename(filePath)] = new Set(chunks);
+                                const moduleMap = {
+                                    es: ts.ModuleKind.ESNext,
+                                    cjs: ts.ModuleKind.CommonJS,
+                                    umd: ts.ModuleKind.ESNext,
+                                };
+                                const code = ts.transpileModule(script, {
+                                    compilerOptions: {
+                                        jsx: ts.JsxEmit.React,
+                                        target: ts.ScriptTarget.ES2016,
+                                        module: moduleMap[format],
+                                    },
+                                    transformers: {
+                                        // @ts-ignore
+                                        before: [createBuiltinModuleTransformer(ts)],
+                                    },
+                                }).outputText;
+                                writeFileSync(filePath, code);
+                                logger.info(`Transpiled browser target file: ${filePath}`);
+                            }
+                            catch (error) {
+                                logger.error(`Failed to transpile ${filePath}:`, error);
+                            }
+                        }
+                    });
+                    // 返回一个 Promise 以便 await
+                    return new Promise((resolve, reject) => {
+                        try {
+                            resolve();
+                        }
+                        catch (error) {
+                            reject(error);
+                        }
+                    });
+                };
+                // 获取输出目录
+                const outDir = options.dir || 'dist';
+                const limit = pLimit(20);
+                // 使用 Promise.all 等待所有格式处理完成
+                await Promise.all(formats.map(async (format) => {
+                    const formatDir = path.resolve(outDir, `${format}`);
+                    const chunkDir = path.resolve(formatDir, 'chunks');
+                    // if not exists, create it
+                    if (!existsSync(chunkDir)) {
+                        mkdirSync(chunkDir, { recursive: true });
+                    }
+                    await limit(() => transpileBuiltinModuleFn(formatDir, format));
+                }));
+                // 现在可以处理完整依赖链
+                logger.info('All transpile tasks done, start to handle dependency chain...');
+                // 在这里处理 allChunksMap 的完整依赖链
+                Object.entries(allChunksMap).forEach(([entryFile, directDeps]) => {
+                    // 收集所有间接依赖
+                    const allDeps = [...directDeps];
+                    // 递归寻找间接依赖
+                    function findTransitiveDeps(chunks) {
+                        chunks.forEach((chunk) => {
+                            // 如果该chunk本身也是个入口(有依赖列表)
+                            if (chunk in allChunksMap) {
+                                const subDeps = allChunksMap[chunk];
+                                // 添加未包含的依赖
+                                if (subDeps) {
+                                    subDeps.forEach((dep) => {
+                                        if (!allDeps.includes(dep)) {
+                                            allDeps.push(dep);
+                                            // 递归寻找这个依赖的依赖
+                                            findTransitiveDeps([dep]);
+                                        }
+                                    });
+                                }
+                            }
+                        });
+                    }
+                    // 开始递归查找
+                    findTransitiveDeps([...directDeps]);
+                    // 更新为完整依赖列表
+                    allChunksMap[entryFile] = new Set(allDeps);
+                });
+                // 转换 Set 为数组以便正确序列化
+                const serializedMap = Object.entries(allChunksMap).reduce((result, [key, deps]) => {
+                    result[key] = Array.from(deps);
+                    return result;
+                }, {});
+                formats.forEach((format) => {
+                    // 存下来
+                    writeFileSync(path.join(outDir, `${format}/chunks-map.json`), JSON.stringify(serializedMap, null, 2));
+                });
+            },
+        },
+    ];
 }
 export default vitePluginCodeSplitter;