@vitarx/plugin-vite 0.0.1-alpha.0

package/dist/transform.js

@@ -0,0 +1,144 @@
+/**
+ * 主转换模块
+ * 负责解析 JSX/TSX 代码并转换为 createView 调用
+ * @module transform
+ */
+import generate from '@babel/generator';
+import { parse } from '@babel/parser';
+import traverse from '@babel/traverse';
+import { createContext } from './context.js';
+import { collectExistingImports, collectLocalBindings, collectRefApiAliases, collectRefVariables, injectHMRSupport, injectImports, processJSXElement, processJSXFragment, processPureCompileComponent, processVIfChain, transformJSXElement } from './passes/index.js';
+import { collectComponentFunctions, generateUniqueAlias, getJSXElementName, isPureCompileComponent } from './utils/index.js';
+/** 用于追踪已处理的节点 */
+const processedNodes = new WeakSet();
+/**
+ * 检查文件是否需要转换
+ */
+function shouldTransform(id) {
+    if (id.includes('node_modules'))
+        return false;
+    const ext = id.split('?')[0].split('.').pop()?.toLowerCase();
+    return ext === 'jsx' || ext === 'tsx';
+}
+/**
+ * 创建解析器选项
+ */
+function createParserOptions() {
+    return {
+        sourceType: 'module',
+        plugins: [
+            'jsx',
+            'typescript',
+            'decorators',
+            'classProperties',
+            'objectRestSpread',
+            'optionalChaining',
+            'nullishCoalescingOperator'
+        ],
+        // 确保保留位置信息
+        ranges: true,
+        tokens: false
+    };
+}
+/**
+ * 设置 API 别名
+ */
+function setupAliases(ctx, program) {
+    const { vitarxImports } = collectExistingImports(program);
+    const localBindings = collectLocalBindings(program);
+    const allNames = new Set([...localBindings]);
+    const apiNames = [
+        'createView',
+        'Fragment',
+        'branch',
+        'dynamic',
+        'access',
+        'withDirectives',
+        'unref',
+        'isRef'
+    ];
+    for (const apiName of apiNames) {
+        if (vitarxImports.has(apiName)) {
+            ctx.vitarxAliases[apiName] = vitarxImports.get(apiName);
+        }
+        else if (allNames.has(apiName)) {
+            ctx.vitarxAliases[apiName] = generateUniqueAlias(apiName, allNames);
+        }
+    }
+    if (ctx.options.hmr) {
+        ctx.vitarxAliases.createView = generateUniqueAlias('jsxDEV', allNames);
+    }
+}
+/**
+ * 收集 ref 相关信息
+ */
+function collectRefInfo(ctx, program) {
+    const refApiAliases = collectRefApiAliases(program);
+    ctx.refApiAliases = refApiAliases;
+    ctx.refVariables = collectRefVariables(program, refApiAliases);
+}
+/**
+ * 转换 AST
+ */
+function transformAST(ast, ctx) {
+    const babelTraverse = typeof traverse === 'object' ? traverse.default : traverse;
+    babelTraverse(ast, {
+        JSXElement: {
+            enter(path) {
+                if (processedNodes.has(path.node))
+                    return;
+                const name = getJSXElementName(path.node);
+                if (name && isPureCompileComponent(name)) {
+                    processedNodes.add(path.node);
+                    processPureCompileComponent(path, ctx);
+                }
+            },
+            exit(path) {
+                if (processedNodes.has(path.node))
+                    return;
+                const name = getJSXElementName(path.node);
+                if (name && isPureCompileComponent(name))
+                    return;
+                processedNodes.add(path.node);
+                processJSXElement(path, ctx);
+            }
+        },
+        JSXFragment: {
+            enter(path) {
+                processVIfChain(path, ctx, transformJSXElement);
+            },
+            exit(path) {
+                if (processedNodes.has(path.node))
+                    return;
+                processedNodes.add(path.node);
+                processJSXFragment(path, ctx);
+            }
+        }
+    });
+}
+/**
+ * 生成代码
+ */
+function generateCode(ast, code, id, sourceMap) {
+    const babelGenerate = typeof generate === 'object' ? generate.default : generate;
+    const output = babelGenerate(ast, { sourceMaps: !!sourceMap, filename: id }, code);
+    return { code: output.code, map: output.map || undefined };
+}
+/**
+ * 转换 JSX/TSX 代码
+ */
+export async function transform(code, id, options) {
+    if (!shouldTransform(id))
+        return null;
+    const ast = parse(code, createParserOptions());
+    const ctx = createContext(code, id, options, ast);
+    setupAliases(ctx, ast.program);
+    collectRefInfo(ctx, ast.program);
+    const components = collectComponentFunctions(ast.program);
+    transformAST(ast, ctx);
+    injectImports(ast.program, ctx);
+    if (options.hmr && components.length > 0) {
+        injectHMRSupport(ast.program, components, id);
+    }
+    return generateCode(ast, code, id, options.sourceMap);
+}

package/dist/utils/ast-builders.js

@@ -0,0 +1,142 @@
+/**
+ * AST 节点构建函数
+ * @module utils/ast-builders
+ */
+import * as t from '@babel/types';
+import { isIdentifier, isStringLiteral } from '@babel/types';
+import { PURE_COMMENT } from '../constants/index.js';
+/** 用于追踪已添加 PURE 注释的节点 */
+const pureCommentedNodes = new WeakSet();
+/**
+ * 创建 unref 调用
+ * @param argument - 参数表达式
+ * @param alias - unref 别名
+ * @returns CallExpression
+ */
+export function createUnrefCall(argument, alias) {
+    return t.callExpression(t.identifier(alias || 'unref'), [argument]);
+}
+/**
+ * 创建 access 调用
+ * @param object - 对象表达式
+ * @param key - 键表达式
+ * @param alias - access 别名
+ * @returns CallExpression
+ */
+export function createAccessCall(object, key, alias) {
+    let keyArg;
+    if (isIdentifier(key)) {
+        keyArg = t.stringLiteral(key.name);
+    }
+    else if (isStringLiteral(key)) {
+        keyArg = key;
+    }
+    else {
+        keyArg = key;
+    }
+    return t.callExpression(t.identifier(alias || 'access'), [object, keyArg]);
+}
+/**
+ * 创建 dynamic 调用
+ * @param argument - 参数表达式
+ * @param alias - dynamic 别名
+ * @returns CallExpression
+ */
+export function createDynamicCall(argument, alias) {
+    return t.callExpression(t.identifier(alias || 'dynamic'), [
+        t.arrowFunctionExpression([], argument)
+    ]);
+}
+/**
+ * 创建 branch 调用
+ * @param condition - 条件函数
+ * @param branches - 分支函数数组
+ * @param alias - branch 别名
+ * @returns CallExpression
+ */
+export function createBranchCall(condition, branches, alias) {
+    return t.callExpression(t.identifier(alias || 'branch'), [condition, t.arrayExpression(branches)]);
+}
+/**
+ * 创建 createView 调用
+ * @param type - 元素类型
+ * @param props - props 对象
+ * @param locInfo - 位置信息对象
+ * @param alias - createView 别名
+ * @returns CallExpression
+ */
+export function createCreateViewCall(type, props, locInfo, alias) {
+    const args = [type];
+    // props 参数
+    if (props) {
+        args.push(props);
+    }
+    else if (locInfo) {
+        // 如果有 locInfo 但没有 props，需要传 null
+        args.push(t.nullLiteral());
+    }
+    // locInfo 参数
+    if (locInfo) {
+        args.push(locInfo);
+    }
+    return t.callExpression(t.identifier(alias || 'createView'), args);
+}
+/**
+ * 创建 withDirectives 调用
+ * @param view - 视图节点
+ * @param directives - 指令数组，每项为 [指令名, 指令值]
+ * @param alias - withDirectives 别名
+ * @returns CallExpression
+ */
+export function createWithDirectivesCall(view, directives, alias) {
+    const directiveArray = directives.map(([name, value]) => {
+        return t.arrayExpression([t.stringLiteral(name), value]);
+    });
+    return t.callExpression(t.identifier(alias || 'withDirectives'), [
+        view,
+        t.arrayExpression(directiveArray)
+    ]);
+}
+/**
+ * 创建箭头函数
+ * @param body - 函数体表达式
+ * @returns ArrowFunctionExpression
+ */
+export function createArrowFunction(body) {
+    return t.arrowFunctionExpression([], body);
+}
+/**
+ * 创建位置信息对象
+ * @param filename - 文件名
+ * @param loc - 源码位置
+ * @returns ObjectExpression
+ */
+export function createLocationObject(filename, loc) {
+    return t.objectExpression([
+        t.objectProperty(t.identifier('fileName'), t.stringLiteral(filename)),
+        t.objectProperty(t.identifier('lineNumber'), t.numericLiteral(loc.start.line)),
+        t.objectProperty(t.identifier('columnNumber'), t.numericLiteral(loc.start.column + 1))
+    ]);
+}
+/**
+ * 为调用表达式添加 @__PURE__ 注释
+ * @param node - 调用表达式节点
+ * @returns 添加注释后的节点
+ */
+export function addPureComment(node) {
+    if (pureCommentedNodes.has(node)) {
+        return node;
+    }
+    pureCommentedNodes.add(node);
+    t.addComment(node, 'leading', ` ${PURE_COMMENT} `, false);
+    return node;
+}
+/**
+ * 获取 API 别名
+ * @param aliases - 别名映射
+ * @param name - API 名称
+ * @returns 别名或原名
+ */
+export function getAlias(aliases, name) {
+    return aliases[name] || name;
+}

package/dist/utils/ast-guards.js

@@ -0,0 +1,16 @@
+/**
+ * AST 类型守卫函数
+ * 用于判断节点类型
+ * @module utils/ast-guards
+ */
+import { isJSXText } from '@babel/types';
+/**
+ * 判断 JSXText 是否为纯空白文本
+ * @param node - AST 节点
+ * @returns 是否为纯空白文本
+ */
+export function isWhitespaceJSXText(node) {
+    if (!isJSXText(node))
+        return false;
+    return /^\s*$/.test(node.value);
+}

package/dist/utils/branch-factory.js

@@ -0,0 +1,107 @@
+/**
+ * Branch 调用工厂模块
+ * 统一处理条件分支的生成
+ * @module utils/branch-factory
+ */
+import * as t from '@babel/types';
+import { isBooleanLiteral, isIdentifier } from '@babel/types';
+import { markImport } from '../context.js';
+import { addPureComment, createArrowFunction, createBranchCall, createUnrefCall, getAlias } from './ast-builders.js';
+/**
+ * 创建 branch 调用
+ * @param config - 分支配置
+ * @param ctx - 转换上下文
+ * @returns branch 调用表达式
+ */
+export function createBranch(config, ctx) {
+    const { conditions, branches, useRef = true } = config;
+    markImport(ctx, 'branch');
+    // 只有在需要 unref 且条件中有标识符时才标记导入
+    if (useRef && conditions.some(c => isIdentifier(c))) {
+        markImport(ctx, 'unref');
+    }
+    const conditionExpr = buildNestedCondition(conditions, ctx, useRef);
+    const branchAlias = getAlias(ctx.vitarxAliases, 'branch');
+    return addPureComment(createBranchCall(createArrowFunction(conditionExpr), branches, branchAlias));
+}
+/**
+ * 判断表达式是否需要括号包裹
+ * 复杂表达式（逻辑运算、三元运算等）在三元条件中需要括号
+ */
+function needsParentheses(expr) {
+    const type = expr.type;
+    // 逻辑表达式、三元表达式、赋值表达式需要括号
+    return (type === 'LogicalExpression' ||
+        type === 'ConditionalExpression' ||
+        type === 'AssignmentExpression' ||
+        type === 'SequenceExpression' ||
+        type === 'ArrowFunctionExpression');
+}
+/**
+ * 包装表达式（如需要则添加括号）
+ */
+function wrapExpression(expr) {
+    if (needsParentheses(expr)) {
+        return t.parenthesizedExpression(expr);
+    }
+    return expr;
+}
+/**
+ * 构建嵌套条件表达式
+ * 从后向前构建三元表达式链
+ */
+export function buildNestedCondition(conditions, ctx, useRef = true) {
+    if (conditions.length === 0) {
+        return t.nullLiteral();
+    }
+    const unrefAlias = useRef ? getAlias(ctx.vitarxAliases, 'unref') : '';
+    let result = null;
+    const lastIndex = conditions.length - 1;
+    for (let i = lastIndex; i >= 0; i--) {
+        const condition = conditions[i];
+        // v-else 的情况（布尔 true）
+        if (isBooleanLiteral(condition) && condition.value) {
+            result = t.numericLiteral(i);
+            continue;
+        }
+        // 构建条件表达式
+        const conditionExpr = useRef && isIdentifier(condition) ? createUnrefCall(condition, unrefAlias) : condition;
+        // 对复杂条件表达式添加括号
+        const wrappedCondition = wrapExpression(conditionExpr);
+        if (result === null) {
+            result = t.conditionalExpression(wrappedCondition, t.numericLiteral(i), t.nullLiteral());
+        }
+        else {
+            // 嵌套的三元表达式也需要括号
+            const wrappedResult = wrapExpression(result);
+            result = t.conditionalExpression(wrappedCondition, t.numericLiteral(i), wrappedResult);
+        }
+    }
+    return result || t.nullLiteral();
+}
+/**
+ * 从条件数组和分支节点创建完整的 branch 调用
+ * @param conditions - 条件表达式数组
+ * @param branchNodes - 分支节点数组（会被包装为箭头函数）
+ * @param ctx - 转换上下文
+ * @returns branch 调用表达式
+ */
+export function createBranchFromNodes(conditions, branchNodes, ctx) {
+    const branches = branchNodes.map(node => createArrowFunction(node));
+    return createBranch({ conditions, branches, useRef: true }, ctx);
+}
+/**
+ * 创建简单的二元条件 branch（用于三元表达式）
+ * @param condition - 条件表达式
+ * @param consequent - 真值分支
+ * @param alternate - 假值分支
+ * @param ctx - 转换上下文
+ * @returns branch 调用表达式
+ */
+export function createBinaryBranch(condition, consequent, alternate, ctx) {
+    const conditions = [condition, t.booleanLiteral(true)];
+    const branches = [createArrowFunction(consequent), createArrowFunction(alternate)];
+    // 只有条件是 Identifier 时才需要 unref
+    const useRef = isIdentifier(condition);
+    return createBranch({ conditions, branches, useRef }, ctx);
+}

package/dist/utils/component-collect.js

@@ -0,0 +1,233 @@
+/**
+ * AST 收集模块
+ * 负责收集导入、导出、组件等信息的收集
+ * @module passes/transform/collect
+ */
+import * as t from '@babel/types';
+import { DEFAULT_EXPORT_BASE_NAME, PURE_COMPILE_COMPONENTS } from '../constants/index.js';
+import { generateUniqueAlias } from './generate.js';
+/** 纯编译组件名称集合 */
+const PURE_COMPILE_COMPONENT_SET = new Set(PURE_COMPILE_COMPONENTS);
+/**
+ * 生成唯一的默认导出组件名称
+ * 避免与已存在的名称冲突
+ */
+function generateUniqueDefaultName(exportedNames) {
+    if (!exportedNames.has(DEFAULT_EXPORT_BASE_NAME)) {
+        return DEFAULT_EXPORT_BASE_NAME;
+    }
+    return generateUniqueAlias(DEFAULT_EXPORT_BASE_NAME, exportedNames);
+}
+/**
+ * 检查名称是否为有效的组件名称
+ * 必须以大写字母开头
+ */
+function isValidComponentName(name) {
+    return /^[A-Z]/.test(name);
+}
+/**
+ * 从命名导出中收集名称
+ */
+function collectFromNamedExport(node, names) {
+    if (node.declaration) {
+        if (node.declaration.type === 'FunctionDeclaration' && node.declaration.id) {
+            names.add(node.declaration.id.name);
+        }
+        else if (node.declaration.type === 'VariableDeclaration') {
+            for (const decl of node.declaration.declarations) {
+                if (decl.id.type === 'Identifier') {
+                    names.add(decl.id.name);
+                }
+            }
+        }
+    }
+    if (node.specifiers) {
+        for (const spec of node.specifiers) {
+            if (spec.type === 'ExportSpecifier') {
+                names.add(spec.local.name);
+            }
+        }
+    }
+}
+/**
+ * 从默认导出中收集名称
+ */
+function collectFromDefaultExport(node, names) {
+    const decl = node.declaration;
+    if (decl.type === 'FunctionDeclaration' && decl.id) {
+        names.add(decl.id.name);
+    }
+    else if (decl.type === 'Identifier') {
+        names.add(decl.name);
+    }
+    // 匿名函数不在此处预留名称，而是在处理时动态生成唯一名称
+}
+/**
+ * 检查函数是否为组件函数
+ * 通过遍历 AST 检查是否包含 JSX 元素
+ */
+function isComponentFunction(node) {
+    let result = false;
+    const check = (n) => {
+        if (result)
+            return;
+        // 直接包含 JSX 元素
+        if (n.type === 'JSXElement' || n.type === 'JSXFragment') {
+            result = true;
+            return;
+        }
+        // 检查 return 语句中的纯编译组件
+        if (n.type === 'ReturnStatement' && n.argument?.type === 'JSXElement') {
+            const opening = n.argument.openingElement;
+            if (opening.name.type === 'JSXIdentifier' &&
+                PURE_COMPILE_COMPONENT_SET.has(opening.name.name)) {
+                result = true;
+                return;
+            }
+        }
+        // 递归遍历子节点
+        for (const key of Object.keys(n)) {
+            const child = n[key];
+            if (child && typeof child === 'object') {
+                if (Array.isArray(child)) {
+                    for (const c of child) {
+                        if (c && typeof child === 'object')
+                            check(c);
+                    }
+                }
+                else {
+                    check(child);
+                }
+            }
+        }
+    };
+    check(node);
+    return result;
+}
+/**
+ * 尝试添加组件到列表
+ * 检查名称有效性、是否导出、是否为组件函数
+ */
+function tryAddComponent(name, node, exportedNames, components) {
+    if (isValidComponentName(name) && exportedNames.has(name) && isComponentFunction(node)) {
+        components.push({ name, node });
+    }
+}
+/**
+ * 处理变量声明中的组件
+ */
+function processVariableDeclaration(declaration, exportedNames, components) {
+    for (const decl of declaration.declarations) {
+        if (decl.id.type !== 'Identifier')
+            continue;
+        const init = decl.init;
+        if (init?.type === 'ArrowFunctionExpression' || init?.type === 'FunctionExpression') {
+            tryAddComponent(decl.id.name, init, exportedNames, components);
+        }
+    }
+}
+/**
+ * 将函数表达式或箭头函数转换为命名函数声明
+ */
+function convertToNamedFunctionDeclaration(func, name) {
+    let body;
+    if (func.type === 'ArrowFunctionExpression' && func.body.type !== 'BlockStatement') {
+        body = t.blockStatement([t.returnStatement(func.body)]);
+    }
+    else {
+        body = func.body;
+    }
+    const funcDecl = t.functionDeclaration(t.identifier(name), func.params, body, func.type === 'FunctionExpression' ? func.generator : false, func.async);
+    funcDecl.loc = func.loc;
+    return funcDecl;
+}
+/**
+ * 处理默认导出的匿名函数
+ * 为匿名函数生成唯一名称并转换为命名函数声明
+ */
+function processAnonymousDefaultExport(node, exportedNames, components) {
+    const decl = node.declaration;
+    let funcNode = null;
+    let name;
+    // 匿名函数声明
+    if (decl.type === 'FunctionDeclaration' && !decl.id) {
+        if (!isComponentFunction(decl))
+            return;
+        name = generateUniqueDefaultName(exportedNames);
+        decl.id = t.identifier(name);
+        funcNode = decl;
+    }
+    // 函数表达式
+    else if (decl.type === 'FunctionExpression') {
+        if (!isComponentFunction(decl))
+            return;
+        name = generateUniqueDefaultName(exportedNames);
+        funcNode = convertToNamedFunctionDeclaration(decl, name);
+        node.declaration = funcNode;
+    }
+    // 箭头函数
+    else if (decl.type === 'ArrowFunctionExpression') {
+        if (!isComponentFunction(decl))
+            return;
+        name = generateUniqueDefaultName(exportedNames);
+        funcNode = convertToNamedFunctionDeclaration(decl, name);
+        node.declaration = funcNode;
+    }
+    if (funcNode) {
+        components.push({ name: name, node: funcNode });
+    }
+}
+/**
+ * 收集所有导出的标识符名称
+ */
+function collectExportedNames(program) {
+    const names = new Set();
+    for (const node of program.body) {
+        if (node.type === 'ExportNamedDeclaration') {
+            collectFromNamedExport(node, names);
+        }
+        else if (node.type === 'ExportDefaultDeclaration') {
+            collectFromDefaultExport(node, names);
+        }
+    }
+    return names;
+}
+/**
+ * 收集模块中的组件函数
+ */
+export function collectComponentFunctions(program) {
+    const exportedNames = collectExportedNames(program);
+    const components = [];
+    for (const node of program.body) {
+        // 普通函数声明
+        if (node.type === 'FunctionDeclaration' && node.id) {
+            tryAddComponent(node.id.name, node, exportedNames, components);
+        }
+        // 普通变量声明
+        else if (node.type === 'VariableDeclaration') {
+            processVariableDeclaration(node, exportedNames, components);
+        }
+        // 命名导出
+        else if (node.type === 'ExportNamedDeclaration' && node.declaration) {
+            if (node.declaration.type === 'FunctionDeclaration' && node.declaration.id) {
+                tryAddComponent(node.declaration.id.name, node.declaration, exportedNames, components);
+            }
+            else if (node.declaration.type === 'VariableDeclaration') {
+                processVariableDeclaration(node.declaration, exportedNames, components);
+            }
+        }
+        // 默认导出
+        else if (node.type === 'ExportDefaultDeclaration') {
+            const decl = node.declaration;
+            // 命名函数声明
+            if (decl.type === 'FunctionDeclaration' && decl.id) {
+                tryAddComponent(decl.id.name, decl, exportedNames, components);
+            }
+            // 匿名函数（函数声明、函数表达式、箭头函数）
+            else {
+                processAnonymousDefaultExport(node, exportedNames, components);
+            }
+        }
+    }
+    return components;
+}

package/dist/utils/generate.js

@@ -0,0 +1,11 @@
+/**
+ * 生成唯一的别名
+ * 从 $1 开始递增，直到找到不冲突的名称
+ */
+export function generateUniqueAlias(baseName, existingNames) {
+    let index = 1;
+    while (existingNames.has(`${baseName}$${index}`)) {
+        index++;
+    }
+    return `${baseName}$${index}`;
+}

package/dist/utils/index.js

@@ -0,0 +1,16 @@
+// 类型守卫
+export { isWhitespaceJSXText } from './ast-guards.js';
+// JSX 辅助函数
+export { getJSXElementName, isPureCompileComponent, isComponent, isNativeElement, getJSXAttributeByName, hasDirective, getDirectiveValue, isVIfChain, isVIf, isVElseIf, isVElse, removeVDirectives, removeAttribute, filterWhitespaceChildren, validateMatchInSwitch } from './jsx-helpers.js';
+// AST 构建函数
+export { createUnrefCall, createAccessCall, createDynamicCall, createBranchCall, createCreateViewCall, createWithDirectivesCall, createArrowFunction, createLocationObject, addPureComment, getAlias } from './ast-builders.js';
+// 模式处理辅助函数
+export { collectPatternBindings, collectObjectPatternBindings } from './pattern-helpers.js';
+// Branch 工厂
+export { createBranch, createBinaryBranch, buildNestedCondition } from './branch-factory.js';
+// v-if 链处理工具
+export { validateVIfChain, collectVIfChainInfo, collectFragmentVIfChains } from './vif-helpers.js';
+// 组件收集
+export { collectComponentFunctions } from './component-collect.js';
+// 生成器
+export { generateUniqueAlias } from './generate.js';