@caryhu/codemine-forge 0.0.1-alpha.2 → 0.0.1-alpha.3

package/dist/build-pipeline/browser-bundle.js

@@ -24,6 +24,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createBrowserBundle = void 0;
+const compiler_sfc_1 = require("@vue/compiler-sfc");
 const ts = __importStar(require("typescript"));
 const virtual_file_system_1 = require("../virtual-file-system");
 const diagnostics_1 = require("./diagnostics");
@@ -324,234 +325,53 @@ function transformPackageModule(importer, filePath, content) {
     return transformSuccess(transpileScript(importer, source));
 }
 function createVueSfcModule(sourcePath, source) {
-    const scriptSetup = extractVueSfcBlock(source, "script", "setup") ?? "";
-    const template = extractVueSfcBlock(source, "template") ?? "";
-    const bindings = collectVueSetupBindings(scriptSetup);
-    const renderExpression = createVueRenderExpression(template);
-    const setupReturn = bindings.length === 0
-        ? "{}"
-        : `{ ${bindings.map((binding) => `${binding}: ${binding}`).join(", ")} }`;
+    const filename = sourcePath;
+    const id = `forge-vue-${hashText(sourcePath)}`;
+    const parseResult = (0, compiler_sfc_1.parse)(source, { filename });
+    if (parseResult.errors.length > 0) {
+        throw new Error(formatVueCompilerErrors(parseResult.errors));
+    }
+    const { descriptor } = parseResult;
+    const script = descriptor.script === null && descriptor.scriptSetup === null
+        ? undefined
+        : (0, compiler_sfc_1.compileScript)(descriptor, {
+            genDefaultAs: "__forgeVueDefault",
+            id,
+        });
+    const scriptContent = script?.content ?? "const __forgeVueDefault = {};";
+    const template = descriptor.template === null
+        ? undefined
+        : (0, compiler_sfc_1.compileTemplate)({
+            compilerOptions: {
+                bindingMetadata: script?.bindings ?? {},
+            },
+            filename,
+            id,
+            scoped: descriptor.styles.some((style) => style.scoped),
+            source: descriptor.template.content,
+        });
+    if (template?.errors !== undefined && template.errors.length > 0) {
+        throw new Error(formatVueCompilerErrors(template.errors));
+    }
+    const templateContent = template?.code ?? "function render() { return null; }";
     return [
-        'import { h as __forgeVueH } from "vue";',
-        scriptSetup,
+        scriptContent,
+        "",
+        templateContent,
         "",
-        "const __forgeVueComponent = {",
+        "const __forgeVueComponent = Object.assign(__forgeVueDefault, {",
         `  __file: ${JSON.stringify(sourcePath)},`,
-        "  setup() {",
-        `    return ${setupReturn};`,
-        "  },",
-        "  render(__forgeVueCtx) {",
-        `    return ${renderExpression};`,
-        "  },",
-        "};",
+        "  render,",
+        "});",
         "",
         "export default __forgeVueComponent;",
         "",
     ].join("\n");
 }
-function extractVueSfcBlock(source, blockName, requiredAttribute) {
-    const pattern = new RegExp(`<${blockName}\\b([^>]*)>([\\s\\S]*?)<\\/${blockName}>`, "gi");
-    for (const match of source.matchAll(pattern)) {
-        const attributes = match[1] ?? "";
-        if (requiredAttribute !== undefined &&
-            !new RegExp(`\\b${requiredAttribute}\\b`, "i").test(attributes)) {
-            continue;
-        }
-        return match[2].trim();
-    }
-    return undefined;
-}
-function collectVueSetupBindings(scriptSetup) {
-    const bindings = new Set();
-    for (const match of scriptSetup.matchAll(/\bimport\s+(type\s+)?([\s\S]*?)\s+from\s*["'][^"']+["']/g)) {
-        if (match[1] !== undefined) {
-            continue;
-        }
-        for (const binding of parseImportBindingNames(match[2])) {
-            bindings.add(binding);
-        }
-    }
-    const declarationPatterns = [
-        /\b(?:const|let|var)\s+([A-Za-z_$][\w$]*)/g,
-        /\bfunction\s+([A-Za-z_$][\w$]*)/g,
-        /\bclass\s+([A-Za-z_$][\w$]*)/g,
-    ];
-    for (const pattern of declarationPatterns) {
-        for (const match of scriptSetup.matchAll(pattern)) {
-            bindings.add(match[1]);
-        }
-    }
-    return Array.from(bindings).sort((left, right) => left.localeCompare(right));
-}
-function parseImportBindingNames(importClause) {
-    const bindings = [];
-    const trimmed = importClause.trim();
-    if (trimmed.length === 0 || trimmed.startsWith("{")) {
-        bindings.push(...parseNamedImportBindings(trimmed));
-        return bindings;
-    }
-    const [defaultOrNamespace = "", ...rest] = trimmed.split(",");
-    const defaultBinding = defaultOrNamespace.trim();
-    if (defaultBinding.startsWith("* as ")) {
-        bindings.push(defaultBinding.slice(5).trim());
-    }
-    else if (/^[A-Za-z_$][\w$]*$/.test(defaultBinding)) {
-        bindings.push(defaultBinding);
-    }
-    bindings.push(...parseNamedImportBindings(rest.join(",").trim()));
-    return bindings.filter((binding) => /^[A-Za-z_$][\w$]*$/.test(binding));
-}
-function parseNamedImportBindings(importClause) {
-    const namedMatch = importClause.match(/\{([\s\S]*?)\}/);
-    if (namedMatch === null) {
-        return [];
-    }
-    return namedMatch[1]
-        .split(",")
-        .map((part) => part.trim())
-        .filter((part) => part.length > 0 && !part.startsWith("type "))
-        .map((part) => {
-        const aliasMatch = part.match(/\bas\s+([A-Za-z_$][\w$]*)$/);
-        return aliasMatch?.[1] ?? part;
-    })
-        .filter((binding) => /^[A-Za-z_$][\w$]*$/.test(binding));
-}
-function createVueRenderExpression(template) {
-    const nodes = parseVueTemplate(template);
-    const renderedChildren = nodes.map(createVueTemplateNodeExpression);
-    if (renderedChildren.length === 0) {
-        return "null";
-    }
-    return renderedChildren.length === 1
-        ? renderedChildren[0]
-        : `__forgeVueH("div", null, [${renderedChildren.join(", ")}])`;
-}
-function parseVueTemplate(template) {
-    const root = {
-        attributes: [],
-        children: [],
-        tagName: "__root__",
-    };
-    const stack = [root];
-    const tokenPattern = /<!--[\s\S]*?-->|<\/?[^>]+>|{{[\s\S]*?}}|[^<{]+|[<{]/g;
-    for (const match of template.matchAll(tokenPattern)) {
-        const token = match[0];
-        const current = stack[stack.length - 1];
-        if (token.startsWith("<!--")) {
-            continue;
-        }
-        if (token.startsWith("</")) {
-            if (stack.length > 1) {
-                stack.pop();
-            }
-            continue;
-        }
-        if (token.startsWith("<")) {
-            const element = parseVueTemplateElementToken(token);
-            if (element === undefined) {
-                continue;
-            }
-            current.children.push({
-                attributes: element.attributes,
-                children: element.children,
-                kind: "element",
-                tagName: element.tagName,
-            });
-            if (!isSelfClosingVueTemplateToken(token)) {
-                stack.push(element);
-            }
-            continue;
-        }
-        if (token.startsWith("{{")) {
-            current.children.push({
-                expression: token.slice(2, -2).trim(),
-                kind: "interpolation",
-            });
-            continue;
-        }
-        if (token.trim().length > 0) {
-            current.children.push({
-                kind: "text",
-                value: token.replace(/\s+/g, " "),
-            });
-        }
-    }
-    return root.children;
-}
-function parseVueTemplateElementToken(token) {
-    const content = token
-        .slice(1, isSelfClosingVueTemplateToken(token) ? -2 : -1)
-        .trim();
-    const tagMatch = content.match(/^([A-Za-z][\w.-]*)/);
-    if (tagMatch === null) {
-        return undefined;
-    }
-    return {
-        attributes: parseVueTemplateAttributes(content.slice(tagMatch[0].length)),
-        children: [],
-        tagName: tagMatch[1],
-    };
-}
-function parseVueTemplateAttributes(source) {
-    const attributes = [];
-    const pattern = /([:@A-Za-z_][\w:.-]*)(?:\s*=\s*("[^"]*"|'[^']*'|[^\s"'>/]+))?/g;
-    for (const match of source.matchAll(pattern)) {
-        const name = match[1];
-        if (name.startsWith(":") ||
-            name.startsWith("@") ||
-            name.startsWith("v-")) {
-            continue;
-        }
-        const rawValue = match[2];
-        const value = rawValue === undefined
-            ? true
-            : rawValue.replace(/^["']|["']$/g, "");
-        attributes.push({ name, value });
-    }
-    return attributes;
-}
-function createVueTemplateNodeExpression(node) {
-    switch (node.kind) {
-        case "element":
-            return createVueElementExpression(node);
-        case "interpolation":
-            return createVueInterpolationExpression(node.expression);
-        case "text":
-            return JSON.stringify(node.value);
-    }
-}
-function createVueElementExpression(node) {
-    const tagExpression = /^[A-Z]/.test(node.tagName)
-        ? `(__forgeVueCtx[${JSON.stringify(node.tagName)}] ?? ${JSON.stringify(node.tagName)})`
-        : JSON.stringify(node.tagName);
-    const propsExpression = createVuePropsExpression(node.attributes);
-    const children = node.children.map(createVueTemplateNodeExpression);
-    const childrenExpression = children.length === 0
-        ? "null"
-        : children.length === 1
-            ? children[0]
-            : `[${children.join(", ")}]`;
-    return `__forgeVueH(${tagExpression}, ${propsExpression}, ${childrenExpression})`;
-}
-function createVuePropsExpression(attributes) {
-    if (attributes.length === 0) {
-        return "null";
-    }
-    return `{ ${attributes
-        .map((attribute) => {
-        const value = attribute.value === true ? "true" : JSON.stringify(attribute.value);
-        return `${JSON.stringify(attribute.name)}: ${value}`;
-    })
-        .join(", ")} }`;
-}
-function createVueInterpolationExpression(expression) {
-    if (/^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*)*$/.test(expression)) {
-        return `String(__forgeVueCtx.${expression} ?? "")`;
-    }
-    return "String(\"\")";
-}
-function isSelfClosingVueTemplateToken(token) {
-    return /\/\s*>$/.test(token);
+function formatVueCompilerErrors(errors) {
+    return errors
+        .map((error) => (error instanceof Error ? error.message : String(error)))
+        .join("\n");
 }
 function createWorkspaceCssModule(sourcePath, css) {
     return isCssModulePath(sourcePath)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@caryhu/codemine-forge",
-  "version": "0.0.1-alpha.2",
+  "version": "0.0.1-alpha.3",
   "description": "Browser-side runtime layer for Codemine demos.",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -18,6 +18,7 @@
     "access": "public"
   },
   "dependencies": {
+    "@vue/compiler-sfc": "3.4.0",
     "esbuild-wasm": "^0.28.1",
     "typescript": "4.9.5"
   },