@blocklet/pages-kit-block-studio 0.4.118 → 0.4.119

package/lib/cjs/constants/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PAGES_KIT_STATE_STATE_DIR = exports.IGNORE_WATCH_PREFIX = exports.DEFAULT_BLOCK_ENTRY_FILES_PATTERN = exports.NANOID_LENGTH = exports.PREVIEW_IMAGE_DIR = exports.METADATA_FILE_NAME = exports.libDir = exports.NEW_BLOCK_TEMPLATE_METADATA_PATH = exports.NEW_BLOCK_TEMPLATE_PATH = exports.MEDIA_KIT_RESOURCE_TYPE = exports.MEDIA_KIT_DID = exports.PAGES_KIT_BLOCK_STUDIO_RESOURCE_TYPE = exports.PAGES_KIT_BLOCK_STUDIO_DID = exports.PAGES_KIT_RESOURCE_TYPE = exports.PAGES_KIT_DID = void 0;
+exports.PAGES_KIT_STATE_STATE_DIR = exports.IGNORE_WATCH_PREFIX = exports.DEFAULT_BLOCK_ENTRY_FILES_PATTERN = exports.NANOID_LENGTH = exports.EDIT_COMPONENT_FILE_NAME_REGEX = exports.PREVIEW_IMAGE_DIR = exports.METADATA_FILE_NAME = exports.libDir = exports.NEW_BLOCK_TEMPLATE_METADATA_PATH = exports.NEW_BLOCK_TEMPLATE_PATH = exports.MEDIA_KIT_RESOURCE_TYPE = exports.MEDIA_KIT_DID = exports.PAGES_KIT_BLOCK_STUDIO_RESOURCE_TYPE = exports.PAGES_KIT_BLOCK_STUDIO_DID = exports.PAGES_KIT_RESOURCE_TYPE = exports.PAGES_KIT_DID = void 0;
 const path_1 = __importDefault(require("path"));
 exports.PAGES_KIT_DID = 'z8iZiDFg3vkkrPwsiba1TLXy3H9XHzFERsP8o';
 exports.PAGES_KIT_RESOURCE_TYPE = 'page';
@@ -16,6 +16,7 @@ exports.NEW_BLOCK_TEMPLATE_METADATA_PATH = path_1.default.join(__dirname, 'new-b
 exports.libDir = 'lib';
 exports.METADATA_FILE_NAME = '@metadata.json';
 exports.PREVIEW_IMAGE_DIR = '@preview-images';
+exports.EDIT_COMPONENT_FILE_NAME_REGEX = /@edit-component\.(ts|tsx|js|jsx)$/;
 exports.NANOID_LENGTH = 16;
 exports.DEFAULT_BLOCK_ENTRY_FILES_PATTERN = 'src/**/index.{ts,tsx}';
 exports.IGNORE_WATCH_PREFIX = ['@del-*', '@tmp-*', '.*', 'staging', 'production', '@backup-*'];

package/lib/cjs/middlewares/init-resource-router.js

@@ -44,6 +44,7 @@ const component_1 = require("@blocklet/sdk/lib/component");
 const child_process_1 = require("child_process");
 const express_1 = require("express");
 const fs_1 = __importDefault(require("fs"));
+const get_1 = __importDefault(require("lodash/get"));
 const set_1 = __importDefault(require("lodash/set"));
 const path_1 = __importStar(require("path"));
 const helper_1 = require("../utils/helper");
@@ -141,6 +142,7 @@ exports.initResourceRouter.post('/', async (req, res) => {
                 FORCE_COLOR: '1',
                 BLOCK_FILTER: componentIds.join(','),
                 NODE_OPTIONS: '--max_old_space_size=16384',
+                NODE_ENV: 'production',
             },
         });
         // save current build process
@@ -187,6 +189,20 @@ exports.initResourceRouter.post('/', async (req, res) => {
                 (0, set_1.default)(metadata, 'renderer.type', 'react-component');
                 (0, set_1.default)(metadata, 'renderer.chunks', chunksMap[jsName] || []);
             }
+            // get edit component code
+            try {
+                const editComponentJsName = `${(0, helper_1.getEditComponentBlockName)(blockName)}.js`;
+                const editComponentCode = fs_1.default.readFileSync((0, path_1.join)(codeDir, editComponentJsName), 'utf8');
+                if (editComponentCode) {
+                    // add edit component code
+                    (0, set_1.default)(metadata, 'renderer.editComponent', editComponentCode);
+                    // append edit component chunks
+                    (0, set_1.default)(metadata, 'renderer.chunks', Array.from(new Set([...(0, get_1.default)(metadata, 'renderer.chunks', []), ...(chunksMap[editComponentJsName] || [])])));
+                }
+            }
+            catch (error) {
+                // ignore error
+            }
             // write metadata to metadataPath
             const metadataYmlPath = path_1.default.join(componentsDir, `${metadata.name || 'unnamed'}.${metadata.id}.yml`);
             fs_1.default.writeFileSync(metadataYmlPath, (0, helper_1.generateYaml)(metadata));

package/lib/cjs/middlewares/init-uploader-router.js

@@ -95,4 +95,7 @@ exports.initUploaderRouter.use('/uploads', (0, uploader_server_1.initProxyToMedi
 exports.initUploaderRouter.use('/chunks', dynamicResourceMiddleware, staticResourceMiddleware, (_req, res) => {
     res.status(404).send('CHUNK NOT FOUND').end();
 });
+exports.initUploaderRouter.use('/.well-known/chunks', dynamicResourceMiddleware, staticResourceMiddleware, (_req, res) => {
+    res.status(404).send('CHUNK NOT FOUND').end();
+});
 exports.default = exports.initUploaderRouter;

package/lib/cjs/plugins/vite-plugin-block-studio.js

@@ -55,6 +55,7 @@ const vite_plugin_css_injected_by_js_1 = __importDefault(require("vite-plugin-cs
 const vite_plugin_node_polyfills_1 = require("vite-plugin-node-polyfills");
 const vite_plugin_react_pages_1 = __importStar(require("vite-plugin-react-pages"));
 const helper_1 = require("../utils/helper");
+const vite_plugin_code_splitter_1 = require("./vite-plugin-code-splitter");
 const vite_plugin_html_transform_1 = require("./vite-plugin-html-transform");
 const vite_plugin_import_transform_1 = require("./vite-plugin-import-transform");
 // const BUILTIN_MODULES_VAR = '__PAGES_KIT_BUILTIN_MODULES__';
@@ -115,6 +116,7 @@ function initBlockStudioPlugins(options) {
     const workingDir = options?.cwd || process.cwd();
     const entryFilesPattern = options?.entryFilesPattern || (0, helper_1.getBlockEntryFilesPattern)();
     const transpileBuiltinModule = options?.transpileBuiltinModule ?? true;
+    const ignoreSplitEditComponent = options?.ignoreSplitEditComponent ?? false;
     // 处理 blockExternals 参数
     let externalMappings = defaultBlockExternals;
     if (typeof options?.blockExternals === 'function') {
@@ -197,6 +199,7 @@ function initBlockStudioPlugins(options) {
             async config(_config) {
                 const name = await Promise.resolve(`${`${workingDir}/package.json`}`).then(s => __importStar(require(s))).then((res) => res.name).catch(() => 'MyLib');
                 return {
+                    mode: 'production',
                     resolve: {
                         alias: {
                         // crypto: 'crypto-browserify',
@@ -312,19 +315,7 @@ function initBlockStudioPlugins(options) {
         }),
         // initHtmlPreviewTransformPlugin(),
         (0, vite_plugin_css_injected_by_js_1.default)(),
-        // https://github.com/rollup/plugins/tree/master/packages/typescript#noforceemit
-        // typescript({
-        //   declaration: true,
-        //   emitDeclarationOnly: true,
-        //   noForceEmit: true,
-        //   declarationDir: path.resolve(workingDir, 'lib/types'),
-        //   rootDir: path.resolve(workingDir),
-        // }),
-        // initRemoteScriptLocalizerPlugin({
-        //   tempDir: 'temp/remote-scripts', // 可选，默认值
-        //   maxConcurrent: 5, // 可选，默认值
-        //   timeout: 30 * 1000, // 可选，默认值 30 秒
-        // }),
+        ignoreSplitEditComponent ? undefined : (0, vite_plugin_code_splitter_1.vitePluginCodeSplitter)(),
         {
             name: 'post-build-file-transpiler',
             apply: 'build',

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

@@ -0,0 +1,341 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.vitePluginCodeSplitter = vitePluginCodeSplitter;
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const typescript_1 = __importDefault(require("typescript"));
+const constants_1 = require("../constants");
+const helper_1 = require("../utils/helper");
+/**
+ * 分析组件文件结构
+ * @param sourceFile TypeScript源文件
+ */
+function analyzeComponent(sourceFile) {
+    const result = {};
+    // 访问AST节点
+    function visit(node) {
+        // 找到默认导出
+        if (typescript_1.default.isExportAssignment(node)) {
+            result.defaultExport = {
+                pos: node.pos,
+                end: node.end,
+            };
+        }
+        // 检查函数声明的默认导出
+        if (typescript_1.default.isFunctionDeclaration(node) && node.modifiers) {
+            const isExport = node.modifiers.some((m) => m.kind === typescript_1.default.SyntaxKind.ExportKeyword);
+            const isDefault = node.modifiers.some((m) => m.kind === typescript_1.default.SyntaxKind.DefaultKeyword);
+            if (isExport && isDefault) {
+                result.defaultExport = {
+                    pos: node.pos,
+                    end: node.end,
+                };
+            }
+        }
+        // 找到命名导出 - EditComponent
+        if (typescript_1.default.isVariableStatement(node) && node.modifiers?.some((m) => m.kind === typescript_1.default.SyntaxKind.ExportKeyword)) {
+            const { declarations } = node.declarationList;
+            for (const decl of declarations) {
+                if (typescript_1.default.isIdentifier(decl.name) && decl.name.text === helper_1.EDIT_COMPONENT_NAME) {
+                    result.editComponent = {
+                        pos: node.pos,
+                        end: node.end,
+                    };
+                    break;
+                }
+            }
+        }
+        // 检查导出声明
+        if (typescript_1.default.isExportDeclaration(node) && node.exportClause) {
+            if (typescript_1.default.isNamedExports(node.exportClause)) {
+                const hasEditComponent = node.exportClause.elements.some((element) => typescript_1.default.isExportSpecifier(element) && element.name.text === helper_1.EDIT_COMPONENT_NAME);
+                if (hasEditComponent) {
+                    result.editComponent = {
+                        pos: node.pos,
+                        end: node.end,
+                    };
+                }
+            }
+        }
+        // 处理导出的箭头函数/函数表达式
+        if (typescript_1.default.isVariableStatement(node)) {
+            const { declarations } = node.declarationList;
+            for (const decl of declarations) {
+                if (typescript_1.default.isIdentifier(decl.name) && decl.name.text === helper_1.EDIT_COMPONENT_NAME) {
+                    if (node.modifiers?.some((m) => m.kind === typescript_1.default.SyntaxKind.ExportKeyword)) {
+                        result.editComponent = {
+                            pos: node.pos,
+                            end: node.end,
+                        };
+                        break;
+                    }
+                }
+            }
+        }
+        // 递归处理所有子节点
+        typescript_1.default.forEachChild(node, visit);
+    }
+    // 开始遍历
+    visit(sourceFile);
+    return result;
+}
+/**
+ * 转换代码，使用TypeScript编译器API
+ */
+function transformCode(code, renderType) {
+    // 创建源文件
+    const sourceFile = typescript_1.default.createSourceFile('temp.tsx', code, typescript_1.default.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 { ${helper_1.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;
+}
+/**
+ * 进一步增强版本：通过完整的AST转换
+ */
+function transformCodeWithPrinter(code, renderType) {
+    try {
+        // 创建源文件
+        const sourceFile = typescript_1.default.createSourceFile('temp.tsx', code, typescript_1.default.ScriptTarget.Latest, true);
+        // 创建转换器上下文
+        const transformerFactory = (context) => {
+            return (sourceFile) => {
+                // 访问并转换节点
+                const visitor = (node) => {
+                    // view模式：移除EditComponent相关代码
+                    if (renderType === 'view') {
+                        // 移除 export const EditComponent 声明
+                        if (typescript_1.default.isVariableStatement(node) && node.modifiers?.some((m) => m.kind === typescript_1.default.SyntaxKind.ExportKeyword)) {
+                            const { declarations } = node.declarationList;
+                            if (declarations.some((d) => typescript_1.default.isIdentifier(d.name) && d.name.text === helper_1.EDIT_COMPONENT_NAME)) {
+                                return typescript_1.default.factory.createEmptyStatement();
+                            }
+                        }
+                        // 移除 export { EditComponent } 形式的导出
+                        if (typescript_1.default.isExportDeclaration(node) && node.exportClause && typescript_1.default.isNamedExports(node.exportClause)) {
+                            const { elements } = node.exportClause;
+                            if (elements.some((e) => typescript_1.default.isExportSpecifier(e) && e.name.text === helper_1.EDIT_COMPONENT_NAME)) {
+                                // 如果只有EditComponent一个导出，就完全移除
+                                if (elements.length === 1) {
+                                    return typescript_1.default.factory.createEmptyStatement();
+                                }
+                                // 否则创建新的导出声明，但不包含EditComponent
+                                const newElements = elements.filter((e) => !(typescript_1.default.isExportSpecifier(e) && e.name.text === helper_1.EDIT_COMPONENT_NAME));
+                                return typescript_1.default.factory.createExportDeclaration(node.modifiers, node.isTypeOnly, typescript_1.default.factory.createNamedExports(newElements), node.moduleSpecifier);
+                            }
+                        }
+                    }
+                    // setting模式：直接导出EditComponent
+                    if (renderType === 'setting') {
+                        // 找到默认导出节点进行替换
+                        if (typescript_1.default.isExportAssignment(node) && node.isExportEquals === false) {
+                            // 替换 export default xxx 形式为 export { EditComponent as default }
+                            return typescript_1.default.factory.createExportDeclaration(undefined, false, typescript_1.default.factory.createNamedExports([
+                                typescript_1.default.factory.createExportSpecifier(false, typescript_1.default.factory.createIdentifier(helper_1.EDIT_COMPONENT_NAME), typescript_1.default.factory.createIdentifier('default')),
+                            ]));
+                        }
+                        // 处理 export default function Xxx() {} 形式
+                        if (typescript_1.default.isFunctionDeclaration(node) &&
+                            node.modifiers?.some((m) => m.kind === typescript_1.default.SyntaxKind.ExportKeyword) &&
+                            node.modifiers?.some((m) => m.kind === typescript_1.default.SyntaxKind.DefaultKeyword)) {
+                            // 创建新的默认导出，导出EditComponent作为default
+                            return typescript_1.default.factory.createExportDeclaration(undefined, false, typescript_1.default.factory.createNamedExports([
+                                typescript_1.default.factory.createExportSpecifier(false, typescript_1.default.factory.createIdentifier(helper_1.EDIT_COMPONENT_NAME), typescript_1.default.factory.createIdentifier('default')),
+                            ]));
+                        }
+                    }
+                    return typescript_1.default.visitEachChild(node, visitor, context);
+                };
+                return typescript_1.default.visitNode(sourceFile, visitor);
+            };
+        };
+        // 转换代码
+        const result = typescript_1.default.transform(sourceFile, [transformerFactory]);
+        const printer = typescript_1.default.createPrinter({ newLine: typescript_1.default.NewLineKind.LineFeed });
+        if (result.transformed.length > 0) {
+            const transformedSourceFile = result.transformed[0];
+            // TypeScript 类型保证
+            if (transformedSourceFile) {
+                const transformedCode = printer.printFile(transformedSourceFile);
+                result.dispose(); // 清理资源
+                return transformedCode;
+            }
+        }
+        result.dispose();
+        return code;
+    }
+    catch (error) {
+        helper_1.logger.error('Error transforming with printer:', error);
+        // 如果高级转换失败，回退到简单转换
+        return transformCode(code, renderType);
+    }
+}
+/**
+ * 检查文件是否包含EditComponent导出
+ */
+function hasEditComponentExportInEntryFile(filePath) {
+    try {
+        if (!fs_1.default.existsSync(filePath)) {
+            return false;
+        }
+        // 读取文件内容
+        const content = fs_1.default.readFileSync(filePath, 'utf-8');
+        // 创建源文件
+        const sourceFile = typescript_1.default.createSourceFile(filePath, content, typescript_1.default.ScriptTarget.Latest, true);
+        // 使用已有的analyzeComponent函数分析
+        const analysis = analyzeComponent(sourceFile);
+        // 如果存在EditComponent导出，则返回true
+        return !!analysis.editComponent;
+    }
+    catch (error) {
+        helper_1.logger.warn(`Error checking EditComponent in ${filePath}:`, error);
+        return false;
+    }
+}
+// 检查目录中是否存在@edit-component文件
+function findEditComponentFileInDir(filePath) {
+    const dirPath = path_1.default.dirname(filePath);
+    // 获取目录中的所有文件
+    try {
+        const files = fs_1.default.readdirSync(dirPath);
+        // 检查是否有匹配的文件
+        const file = files.find((file) => constants_1.EDIT_COMPONENT_FILE_NAME_REGEX.test(file));
+        if (file) {
+            return path_1.default.join(dirPath, file);
+        }
+        return null;
+    }
+    catch (error) {
+        helper_1.logger.warn(`Failed to check @edit-component file in ${dirPath}: ${error}`);
+        return null;
+    }
+}
+/**
+ * Vite 插件：组件代码拆分器
+ * 用于自动将组件文件拆分为视图组件和编辑组件
+ */
+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_1.default.basename(filePath);
+                                if (hasEditComponent) {
+                                    helper_1.logger.info(`Found EditComponent in ${fileName}`);
+                                    editComponentFilePath = filePath;
+                                }
+                                else {
+                                    helper_1.logger.debug(`No EditComponent found in ${fileName}`);
+                                    editComponentFilePath = findEditComponentFileInDir(filePath);
+                                    // 检查是否存在独立的@edit-component文件
+                                    if (editComponentFilePath) {
+                                        hasEditComponent = true;
+                                        helper_1.logger.info(`Found separate @edit-component file for ${editComponentFilePath}`);
+                                    }
+                                }
+                            }
+                            catch (err) {
+                                helper_1.logger.warn(`Failed to check EditComponent in ${filePath}: ${err}`);
+                            }
+                            // 视图组件总是保留
+                            newEntry[key] = `${filePath}?renderType=view`;
+                            // 只为包含EditComponent的文件创建编辑入口
+                            if (hasEditComponent) {
+                                newEntry[(0, helper_1.getEditComponentBlockName)(key)] = `${editComponentFilePath}?renderType=setting`;
+                            }
+                        }
+                    });
+                    // 更新配置
+                    libConfig.entry = newEntry;
+                    helper_1.logger.info('Auto-split components enabled, entries updated');
+                }
+            }
+            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;
+                }
+                // 确保文件存在
+                if (!fs_1.default.existsSync(filePath)) {
+                    helper_1.logger.error(`File not found: ${filePath}`);
+                    return null;
+                }
+                // 读取文件内容
+                const code = fs_1.default.readFileSync(filePath, 'utf-8');
+                // 根据渲染类型进行代码转换
+                // logger.info(`Splitting code for ${renderType}: ${filePath}`);
+                try {
+                    // 首先尝试使用高级转换
+                    return transformCodeWithPrinter(code, renderType);
+                }
+                catch (transformError) {
+                    helper_1.logger.warn(`Advanced transform failed, falling back to basic transform: ${transformError}`);
+                    // 如果失败，回退到基本转换
+                    return transformCode(code, renderType);
+                }
+            }
+            catch (error) {
+                helper_1.logger.error(`Error processing module ${id}:`, error);
+            }
+            return null;
+        },
+    };
+}
+exports.default = vitePluginCodeSplitter;