vitempl 0.0.0 → 0.1.0

package/dist/jinja-like-BokTIprh.js

@@ -0,0 +1,475 @@
+import { camelize, escapeHtml, hyphenate, isBooleanAttr, isGloballyAllowed, isVoidTag } from "@vue/shared";
+import { ElementTypes, NodeTypes } from "@vue/compiler-core";
+//#region src/engines/jinja-like.ts
+/** Директивы, которые обрабатываются на уровне элемента */
+const STRUCTURAL = /* @__PURE__ */ new Set([
+	"if",
+	"else-if",
+	"else",
+	"for"
+]);
+/** Имя макроса, которым становится компонент */
+const MACRO = "render";
+/** Операторы сравнения: из выражения Vue — в выражение шаблонизатора */
+const COMPARISON = {
+	"===": "==",
+	"==": "==",
+	"!==": "!=",
+	"!=": "!=",
+	"<": "<",
+	"<=": "<=",
+	">": ">",
+	">=": ">="
+};
+/** Адаптер jinja-подобного шаблонизатора из описания его диалекта */
+function jinjaEngine(dialect) {
+	return {
+		name: dialect.name,
+		extension: dialect.extension,
+		analyze: (nodes, context) => generateJinjaLike(nodes, context, dialect).info,
+		generate: (nodes, context) => generateJinjaLike(nodes, context, dialect)
+	};
+}
+/**
+* Генерирует шаблон jinja-подобного шаблонизатора из шаблона Vue SFC.
+*
+* Страница и фрагмент становятся обычным шаблоном: их данные готовит сервер.
+* Остальные шаблоны становятся макросом `render`, параметры которого —
+* данные, к которым шаблон обращается; вызывающий передаёт их по именам,
+* а слот доходит до макроса через `{% call %}` и `caller()`.
+*/
+function generateJinjaLike(nodes, context, dialect) {
+	const { components, templates, entry } = context;
+	const errors = [];
+	/** Данные, к которым обращается шаблон */
+	const params = /* @__PURE__ */ new Set();
+	/** Подключённые компоненты: имя шаблона → имя, под которым он импортирован */
+	const imports = /* @__PURE__ */ new Map();
+	let hasSlot = false;
+	const error = (message, loc) => {
+		errors.push({
+			message,
+			loc: {
+				line: loc.start.line,
+				column: loc.start.column
+			}
+		});
+		return "";
+	};
+	/** Имя, под которым компонент импортируется: `partials/AppHeader` → `partials_app_header` */
+	function importName(template) {
+		const existing = imports.get(template);
+		if (existing) return existing;
+		const base = template.split("/").map((segment) => hyphenate(segment).replaceAll(/[^\w]+/g, "_")).join("_");
+		let alias = base;
+		for (let i = 2; [...imports.values()].includes(alias); i++) alias = `${base}_${i}`;
+		imports.set(template, alias);
+		return alias;
+	}
+	function children(nodes, scope) {
+		let out = "";
+		for (let i = 0; i < nodes.length; i++) {
+			const node = nodes[i];
+			if (node.type !== NodeTypes.ELEMENT) {
+				out += child(node, scope);
+				continue;
+			}
+			const vIf = findDirective(node, "if");
+			if (!vIf) {
+				const vElse = findDirective(node, "else-if") ?? findDirective(node, "else");
+				out += vElse ? error("v-else без v-if", vElse.loc) : element(node, scope);
+				continue;
+			}
+			const chain = [{
+				node,
+				directive: vIf
+			}];
+			for (let j = i + 1; j < nodes.length; j++) {
+				const next = nodes[j];
+				if (isBlank(next)) continue;
+				const directive = next.type === NodeTypes.ELEMENT ? findDirective(next, "else-if") ?? findDirective(next, "else") : void 0;
+				if (next.type !== NodeTypes.ELEMENT || !directive) break;
+				chain.push({
+					node: next,
+					directive
+				});
+				i = j;
+				if (directive.name === "else") break;
+			}
+			out += ifChain(chain, scope);
+		}
+		return out;
+	}
+	function child(node, scope) {
+		switch (node.type) {
+			case NodeTypes.TEXT: return escapeDelimiters(node.loc.source);
+			case NodeTypes.COMMENT: return "";
+			case NodeTypes.INTERPOLATION: {
+				const path = toPath(node.content, scope, node.loc);
+				return path ? `{{ ${path} }}` : "";
+			}
+			default: return error("неподдерживаемый узел шаблона", node.loc);
+		}
+	}
+	function ifChain(chain, scope) {
+		let out = "";
+		chain.forEach(({ node, directive }, index) => {
+			if (directive.name === "else") {
+				out += `{% else %}${element(node, scope)}`;
+				return;
+			}
+			const condition = toCondition(directive.exp, scope, directive.loc);
+			if (!condition) return;
+			const keyword = index === 0 ? "if" : dialect.elseIf;
+			out += `{% ${keyword} ${condition.code} %}${element(node, bind(scope, condition))}`;
+		});
+		return `${out}{% endif %}`;
+	}
+	function element(node, scope) {
+		const vFor = findDirective(node, "for");
+		return vFor ? forLoop(node, vFor, scope) : elementBody(node, scope);
+	}
+	function forLoop(node, directive, scope) {
+		const result = directive.forParseResult;
+		if (!result) return error("не удалось разобрать v-for", directive.loc);
+		if (result.index) return error("v-for с тремя переменными (обход объекта) не поддерживается", directive.loc);
+		if (!result.value || !isIdentifier(result.value)) return error("в v-for поддерживаются только простые имена переменных", directive.loc);
+		const item = result.value.content;
+		const locals = /* @__PURE__ */ new Set([...scope.locals, item]);
+		let index;
+		if (result.key) {
+			if (!isIdentifier(result.key)) return error("в v-for поддерживаются только простые имена переменных", directive.loc);
+			index = result.key.content;
+			locals.add(index);
+		}
+		const source = toPath(result.source, scope, directive.loc);
+		if (!source) return "";
+		const inner = {
+			locals,
+			aliases: scope.aliases
+		};
+		return `{% for ${item} in ${source} %}${index ? `{% ${dialect.assign} ${index} = loop.index0 %}` : ""}${elementBody(node, inner)}{% endfor %}`;
+	}
+	function elementBody(node, scope) {
+		switch (node.tagType) {
+			case ElementTypes.ELEMENT: {
+				const open = `<${node.tag}${attributes(node, scope)}>`;
+				return isVoidTag(node.tag) ? open : `${open}${children(node.children, scope)}</${node.tag}>`;
+			}
+			case ElementTypes.TEMPLATE:
+				checkDirectives(node);
+				return children(node.children, scope);
+			case ElementTypes.COMPONENT: return component(node, scope);
+			case ElementTypes.SLOT: return slot(node);
+		}
+	}
+	function checkDirectives(node) {
+		for (const prop of node.props) if (prop.type === NodeTypes.DIRECTIVE && !STRUCTURAL.has(prop.name)) error(`директива v-${prop.name} здесь не поддерживается`, prop.loc);
+	}
+	function attributes(node, scope) {
+		const staticClass = node.props.find((prop) => prop.type === NodeTypes.ATTRIBUTE && prop.name === "class");
+		const hasBoundClass = node.props.some((prop) => prop.type === NodeTypes.DIRECTIVE && bindName(prop) === "class");
+		let out = "";
+		for (const prop of node.props) {
+			if (prop.type === NodeTypes.ATTRIBUTE) {
+				if (prop !== staticClass || !hasBoundClass) out += ` ${escapeDelimiters(prop.loc.source)}`;
+				continue;
+			}
+			if (STRUCTURAL.has(prop.name)) continue;
+			const name = bindArgument(prop);
+			if (!name || name === "key") continue;
+			if (name === "class") {
+				const value = classValue(prop, scope);
+				const base = staticClass?.type === NodeTypes.ATTRIBUTE && staticClass.value ? `${escapeHtml(staticClass.value.content)} ` : "";
+				out += ` class="${base}${value}"`;
+				continue;
+			}
+			if (name === "style") {
+				error(":style не поддерживается", prop.loc);
+				continue;
+			}
+			out += boundAttribute(name, prop, scope);
+		}
+		return out;
+	}
+	/** Имя атрибута из v-bind, для остальных директив — ошибка */
+	function bindArgument(directive) {
+		if (directive.name !== "bind") {
+			error(`директива v-${directive.name} не поддерживается`, directive.loc);
+			return;
+		}
+		const name = bindName(directive);
+		if (!name) {
+			error("v-bind без имени атрибута и с вычисляемым именем не поддерживается", directive.loc);
+			return;
+		}
+		if (directive.modifiers.length) {
+			error("модификаторы v-bind не поддерживаются", directive.loc);
+			return;
+		}
+		return name;
+	}
+	function classValue(directive, scope) {
+		const exp = directive.exp;
+		const ast = exp?.ast;
+		if (ast && ast.type === "ObjectExpression") {
+			const parts = [];
+			for (const property of ast.properties) {
+				const key = property.type === "ObjectProperty" && !property.computed ? property.key.type === "Identifier" ? property.key.name : property.key.type === "StringLiteral" ? property.key.value : void 0 : void 0;
+				const condition = key && property.type === "ObjectProperty" ? toConditionNode(property.value, scope) : void 0;
+				if (!key || !condition) {
+					error(":class поддерживает объект вида { имя: условие }", directive.loc);
+					continue;
+				}
+				parts.push(`{% if ${condition.code} %}${escapeHtml(key)}{% endif %}`);
+			}
+			return parts.join(" ");
+		}
+		if (ast && ast.type === "StringLiteral") return escapeHtml(ast.value);
+		const path = toPath(exp, scope, directive.loc);
+		return path ? `{{ ${path} }}` : "";
+	}
+	function boundAttribute(name, directive, scope) {
+		const exp = sameNameShorthand(directive, name);
+		const ast = exp.ast;
+		if (isBooleanAttr(name)) {
+			if (ast && ast.type === "BooleanLiteral") return ast.value ? ` ${name}` : "";
+			const condition = toCondition(exp, scope, directive.loc);
+			return condition ? `{% if ${condition.code} %} ${name}{% endif %}` : "";
+		}
+		if (ast && (ast.type === "StringLiteral" || ast.type === "NumericLiteral" || ast.type === "BooleanLiteral")) return ` ${name}="${escapeDelimiters(escapeHtml(String(ast.value)))}"`;
+		if (ast && ast.type === "TemplateLiteral") {
+			let value = "";
+			ast.quasis.forEach((quasi, index) => {
+				value += escapeDelimiters(escapeHtml(quasi.value.cooked ?? ""));
+				const expression = ast.expressions[index];
+				if (expression) {
+					const path = toPathNode(expression, scope, directive.loc);
+					value += path ? `{{ ${path} }}` : "";
+				}
+			});
+			return ` ${name}="${value}"`;
+		}
+		const path = toPath(exp, scope, directive.loc);
+		return path ? ` ${name}="{{ ${path} }}"` : "";
+	}
+	function component(node, scope) {
+		const template = components.get(node.tag);
+		if (!template) return error(`компонент <${node.tag}> не импортирован в <script setup>`, node.loc);
+		const self = template === context.name;
+		if (self && !dialect.recursion) return error(`${dialect.name} не поддерживает компонент, который подключает сам себя`, node.loc);
+		const props = /* @__PURE__ */ new Map();
+		for (const prop of node.props) {
+			if (prop.type === NodeTypes.ATTRIBUTE) {
+				props.set(camelize(prop.name), prop.value ? toStringLiteral(prop.value.content) : "true");
+				continue;
+			}
+			if (STRUCTURAL.has(prop.name)) continue;
+			const argument = bindArgument(prop);
+			if (!argument || argument === "key") continue;
+			const key = camelize(argument);
+			const value = toValue(sameNameShorthand(prop, key), scope, prop.loc);
+			if (value) props.set(key, value);
+		}
+		const content = node.children.filter((child) => !isBlank(child));
+		for (const child of content) if (child.type === NodeTypes.ELEMENT && child.tagType === ElementTypes.TEMPLATE && findDirective(child, "slot")) error("именованные слоты не поддерживаются", child.loc);
+		const body = children(content, scope);
+		const info = templates.get(template);
+		const names = info ? info.params : [...props.keys()];
+		const args = [];
+		for (const param of names) {
+			const value = props.get(param);
+			if (value === void 0) {
+				error(`компонент <${node.tag}> обращается к данным "${param}", но они не переданы`, node.loc);
+				continue;
+			}
+			args.push(`${param}=${value}`);
+		}
+		const call = self ? `${MACRO}(${args.join(", ")})` : `${importName(template)}${dialect.namespace}${MACRO}(${args.join(", ")})`;
+		if (info ? info.hasSlot : body !== "") return `{% call ${call} %}${body}{% endcall %}`;
+		if (body !== "") error(`в шаблоне компонента <${node.tag}> нет слота`, node.loc);
+		return `{{ ${call} }}`;
+	}
+	function slot(node) {
+		if (!node.props.every((prop) => prop.type === NodeTypes.ATTRIBUTE && prop.name === "name" && prop.value?.content === "default")) return error("поддерживается только слот по умолчанию без параметров", node.loc);
+		if (node.children.some((child) => !isBlank(child))) return error("запасное содержимое слота не поддерживается", node.loc);
+		if (entry) return error("слот поддерживается только в компоненте: страницу и фрагмент сервер рендерит целиком", node.loc);
+		hasSlot = true;
+		return "{{ caller() }}";
+	}
+	/** Область видимости внутри ветки условия: связанное значение видно как переменная */
+	function bind(scope, condition) {
+		if (!condition.binding) return scope;
+		const { path, alias } = condition.binding;
+		return {
+			locals: /* @__PURE__ */ new Set([...scope.locals, alias]),
+			aliases: new Map([...scope.aliases, [path, alias]])
+		};
+	}
+	function toCondition(exp, scope, loc) {
+		const ast = exp?.ast;
+		if (ast) {
+			const condition = toConditionNode(ast, scope);
+			if (!condition) error(`условие «${exp?.loc.source}» не поддерживается: допустимы путь к данным, его отрицание, сравнение с литералом и проверка на null`, loc);
+			return condition;
+		}
+		const path = toPath(exp, scope, loc);
+		return path ? { code: path } : void 0;
+	}
+	function toConditionNode(node, scope) {
+		if (node.type === "UnaryExpression" && node.operator === "!") {
+			const path = pathOf(node.argument, scope);
+			return path ? { code: dialect.not(path) } : void 0;
+		}
+		if (node.type === "LogicalExpression") {
+			const left = toConditionNode(node.left, scope);
+			const right = toConditionNode(node.right, scope);
+			if (!left || !right || left.binding || right.binding) return;
+			const operator = node.operator === "&&" ? dialect.and : node.operator === "||" ? dialect.or : void 0;
+			return operator ? { code: `(${left.code}) ${operator} (${right.code})` } : void 0;
+		}
+		if (node.type === "BinaryExpression") {
+			const path = pathOf(node.left, scope);
+			if (path && isNullish(node.right)) {
+				const alias = aliasFor(path, scope);
+				if (node.operator === "!==" || node.operator === "!=") return dialect.binds ? {
+					code: dialect.some(path, alias),
+					binding: {
+						path,
+						alias
+					}
+				} : { code: dialect.some(path, alias) };
+				if (node.operator === "===" || node.operator === "==") return { code: dialect.none(path) };
+				return;
+			}
+			const operator = COMPARISON[node.operator];
+			const left = path ?? literalOf(node.left);
+			const right = pathOf(node.right, scope) ?? literalOf(node.right);
+			return operator && left && right ? { code: `${left} ${operator} ${right}` } : void 0;
+		}
+		const path = pathOf(node, scope);
+		return path ? { code: path } : void 0;
+	}
+	/** Имя переменной для связанного значения: последний сегмент пути */
+	function aliasFor(path, scope) {
+		const base = path.split(".").pop().replaceAll(/[^\w]/g, "") || "value";
+		let alias = base;
+		for (let i = 2; scope.locals.has(alias); i++) alias = `${base}_${i}`;
+		return alias;
+	}
+	/** Значение props компонента: литерал или путь к данным */
+	function toValue(exp, scope, loc) {
+		return (exp.ast ? literalOf(exp.ast) : void 0) ?? toPath(exp, scope, loc);
+	}
+	function toPath(exp, scope, loc) {
+		if (!exp || exp.type !== NodeTypes.SIMPLE_EXPRESSION) {
+			error("не удалось разобрать выражение", loc);
+			return;
+		}
+		if (exp.ast === null) return resolve([exp.content.trim()], scope, loc);
+		if (exp.ast === false || exp.ast === void 0) {
+			error(`не удалось разобрать выражение «${exp.content}»`, loc);
+			return;
+		}
+		return toPathNode(exp.ast, scope, loc, exp.content);
+	}
+	function toPathNode(node, scope, loc, source) {
+		const segments = segmentsOf(node);
+		if (!segments) {
+			error(`выражение${source ? ` «${source}»` : ""} не поддерживается: допустимы только пути к данным (a.b.c)`, loc);
+			return;
+		}
+		return resolve(segments, scope, loc);
+	}
+	/** Путь к данным для выражения вида a.b.c, иначе undefined без ошибки */
+	function pathOf(node, scope) {
+		const segments = segmentsOf(node);
+		return segments && resolve(segments, scope);
+	}
+	function resolve(segments, scope, loc) {
+		const [head] = segments;
+		if (head.startsWith("$") || isGloballyAllowed(head)) {
+			if (loc) error(`"${head}" не поддерживается: допустимы только данные шаблона`, loc);
+			return;
+		}
+		for (let i = segments.length; i > 0; i--) {
+			const alias = scope.aliases.get(joinPath(segments.slice(0, i)));
+			if (alias) return joinPath([alias, ...segments.slice(i)]);
+		}
+		if (!scope.locals.has(head)) params.add(head);
+		return joinPath(segments);
+	}
+	const code = children(nodes, {
+		locals: /* @__PURE__ */ new Set(),
+		aliases: /* @__PURE__ */ new Map()
+	});
+	const info = {
+		params: [...params].sort(),
+		hasSlot
+	};
+	return {
+		code: [...imports].map(([template, alias]) => `{% import "${template}${dialect.extension}" as ${alias} %}`).join("") + (entry ? code : `{% macro ${MACRO}(${info.params.join(", ")}) %}${code}{% endmacro %}`),
+		errors,
+		info
+	};
+}
+function joinPath(segments) {
+	return segments.reduce((out, segment) => segment.startsWith("[") ? out + segment : out ? `${out}.${segment}` : segment, "");
+}
+function segmentsOf(node) {
+	switch (node.type) {
+		case "Identifier": return [node.name];
+		case "MemberExpression":
+		case "OptionalMemberExpression": {
+			const object = segmentsOf(node.object);
+			if (!object) return;
+			if (!node.computed && node.property.type === "Identifier") return [...object, node.property.name];
+			if (node.computed && node.property.type === "NumericLiteral") return [...object, `[${node.property.value}]`];
+			return;
+		}
+	}
+}
+/** Литерал шаблонизатора для литерала Vue */
+function literalOf(node) {
+	switch (node.type) {
+		case "StringLiteral": return toStringLiteral(node.value);
+		case "NumericLiteral": return String(node.value);
+		case "BooleanLiteral": return String(node.value);
+	}
+}
+function isNullish(node) {
+	return node.type === "NullLiteral" || node.type === "Identifier" && node.name === "undefined";
+}
+function findDirective(node, name) {
+	return node.props.find((prop) => prop.type === NodeTypes.DIRECTIVE && prop.name === name);
+}
+function bindName(directive) {
+	const arg = directive.arg;
+	return arg?.type === NodeTypes.SIMPLE_EXPRESSION && arg.isStatic ? arg.content : void 0;
+}
+/** `:title` без значения — сокращение для `:title="title"` */
+function sameNameShorthand(directive, name) {
+	return directive.exp ?? {
+		type: NodeTypes.SIMPLE_EXPRESSION,
+		content: camelize(name),
+		isStatic: false,
+		constType: 0,
+		ast: null,
+		loc: directive.loc
+	};
+}
+function isIdentifier(exp) {
+	return exp.type === NodeTypes.SIMPLE_EXPRESSION && /^[A-Za-z_$][\w$]*$/.test(exp.content.trim());
+}
+function isBlank(node) {
+	return node.type === NodeTypes.COMMENT || node.type === NodeTypes.TEXT && !node.content.trim();
+}
+/** Экранирует разделители шаблонизатора в статическом тексте */
+function escapeDelimiters(text) {
+	return text.replaceAll(/\{[{%#]/g, (match) => `{{ "${match}" }}`);
+}
+function toStringLiteral(value) {
+	return `"${value.replaceAll("\"", "\\\"")}"`;
+}
+//#endregion
+export { jinjaEngine as t };

package/package.json

@@ -1,12 +1,9 @@
 {
   "name": "vitempl",
-  "version": "0.0.0",
+  "version": "0.1.0",
   "license": "MIT",
   "author": "Stepan Sotnikov",
-  "description": "Template engine with Vite",
-  "engines": {
-    "node": "^18.0.0 || >=20.0.0"
-  },
+  "description": "Vite-плагин: шаблоны для серверного рендеринга из Vue SFC",
   "homepage": "https://github.com/sotnikovse/vitempl#readme",
   "repository": {
     "type": "git",
@@ -16,35 +13,52 @@
     "url": "https://github.com/sotnikovse/vitempl/issues"
   },
   "keywords": [
-    "frontend",
-    "hmr",
-    "dev-server",
-    "build-tool",
-    "vite"
+    "vite",
+    "vite-plugin",
+    "vue",
+    "template",
+    "engine",
+    "hbs",
+    "handlebars",
+    "askama",
+    "jinja",
+    "build-tool"
   ],
-  "packageManager": "pnpm@8.9.2",
   "type": "module",
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
   "files": [
     "dist"
   ],
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
   "exports": {
-    ".": {
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
-    }
+    ".": "./dist/index.js",
+    "./handlebars": "./dist/engines/handlebars.js",
+    "./askama": "./dist/engines/askama.js",
+    "./jinja": "./dist/engines/jinja.js"
+  },
+  "scripts": {
+    "dev": "tsdown --watch",
+    "build": "tsc && tsdown",
+    "prepublishOnly": "npm run build",
+    "typecheck": "tsc",
+    "test": "vitest run"
+  },
+  "peerDependencies": {
+    "vite": "^8.0.0",
+    "vue": "^3.5.0"
   },
   "dependencies": {
-    "@vue/compiler-sfc": "^3.3.7",
-    "vite": "^4.4.5"
+    "@vue/compiler-core": "^3.5.43",
+    "@vue/shared": "^3.5.43"
   },
   "devDependencies": {
-    "rollup": "^4.1.4"
-  },
-  "scripts": {
-    "dev": "unbuild --stub",
-    "build": "unbuild"
+    "@types/node": "^24.13.6",
+    "handlebars": "^4.7.9",
+    "tsdown": "^0.23.0",
+    "typescript": "~6.0.2",
+    "vite": "^8.3.0",
+    "vitest": "^5.0.1",
+    "vue": "^3.5.43"
   }
-}
+}

package/dist/index.cjs

@@ -1,5 +0,0 @@
-'use strict';
-
-const index = {};
-
-module.exports = index;

package/dist/index.d.cts

@@ -1,3 +0,0 @@
-declare const _default: {};
-
-export { _default as default };

package/dist/index.d.mts

@@ -1,3 +0,0 @@
-declare const _default: {};
-
-export { _default as default };

package/dist/index.mjs

@@ -1,3 +0,0 @@
-const index = {};
-
-export { index as default };