@wevu/compiler 6.21.0 → 6.22.0

package/dist/index.d.mts

@@ -353,9 +353,16 @@ interface TemplateCompileOptions {
   wxsExtension?: string;
   classStyleWxsSrc?: string;
   functionPropNames?: Iterable<FunctionPropNameMatcher>;
+  /**
+   * 允许保留在小程序模板中的直接函数调用名。
+   */
+  templateSafeCallNames?: Iterable<string>;
   wevuComponentTags?: Iterable<string>;
   componentNameMap?: Record<string, string>;
   miniProgramComponentTags?: Iterable<string>;
+  scopeId?: string;
+  slottedScopeId?: string;
+  cssVars?: boolean;
 }
 /**
  * 作用域插槽编译模式。
@@ -604,6 +611,10 @@ interface CompileVueFileOptions {
      * 是否在当前阶段改写 scoped 选择器。预处理语言应由最终 CSS 管线完成隔离时可关闭。
      */
     transformScoped?: boolean;
+    /**
+     * 按预处理语言传递的 Vite CSS 预处理选项。
+     */
+    preprocessOptions?: Record<string, Record<string, unknown>>;
   };
   json?: {
     kind?: 'app' | 'page' | 'component';
@@ -690,7 +701,6 @@ declare function clearFileCaches(): void;
 declare function transformNestedWxssVars(source: string): string;
 //#endregion
 //#region src/plugins/vue/compiler/style.d.ts
-declare function transformVueDeepSelectors(source: string): string;
 /**
  * 样式编译结果。
  */
@@ -698,23 +708,30 @@ interface StyleCompileResult {
   code: string;
   map?: string;
   scopedId?: string;
+  usesSlotted?: boolean;
   modules?: Record<string, Record<string, string>>;
+  dependencies?: string[];
 }
 /**
  * 样式编译选项。
  */
 interface StyleCompileOptions {
   id: string;
+  filename?: string;
   scoped?: boolean;
   transformScoped?: boolean;
   modules?: boolean | string;
-  preprocessOptions?: Record<string, any>;
+  preprocessOptions?: Record<string, unknown>;
   preserveDeepSelectors?: boolean;
 }
 /**
- * 将 Vue SFC 的 style 块转换为 WXSS
+ * compiler-sfc 已在 scoped 插件中处理 deep 选择器，此函数保留为兼容入口。
  */
-declare function compileVueStyleToWxss(styleBlock: SFCStyleBlock, options: StyleCompileOptions): StyleCompileResult;
+declare function transformVueDeepSelectors(source: string): string;
+/**
+ * 将 Vue SFC style 块编译为可交给 Vite CSS 管线的内容。
+ */
+declare function compileVueStyleToWxss(styleBlock: SFCStyleBlock, options: StyleCompileOptions): Promise<StyleCompileResult>;
 //#endregion
 //#region src/plugins/vue/compiler/template/classStyleRuntime.d.ts
 /**
@@ -833,7 +850,7 @@ declare function createJsonMerger(strategy: JsonMergeStrategy | undefined, baseC
 //#endregion
 //#region src/plugins/vue/transform/scopedId.d.ts
 /**
- * 生成 scoped ID
+ * 根据项目内相对路径生成跨机器稳定的 scoped ID。
  */
 declare function generateScopedId(filename: string): string;
 //#endregion
@@ -929,6 +946,10 @@ interface TransformScriptOptions {
    * 当前组件模板包含 scoped slot outlet，需要接收 scoped slot 桥接属性。
    */
   scopedSlotHostProperties?: boolean;
+  /**
+   * 当前 SFC 的 CSS Modules 映射。
+   */
+  cssModules?: Record<string, Record<string, string>>;
 }
 //#endregion
 //#region src/plugins/vue/transform/transformScript/index.d.ts

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { createRequire } from "node:module";
-import { WEAPP_VITE_RUNTIME_REACTIVITY_VIRTUAL_ID, WEAPP_VITE_RUNTIME_TEMPLATE_VIRTUAL_ID, WEAPP_VITE_RUNTIME_VIRTUAL_ID, WEVU_CLASS_STYLE_RUNTIME_FILE, WEVU_CLASS_STYLE_RUNTIME_MODULE, WEVU_EXPRESSION_ERROR_IDENTIFIER, WEVU_FUNCTION_PROP_PATHS_KEY, WEVU_INLINE_HANDLER, WEVU_INLINE_MAP_KEY, WEVU_IS_PAGE_KEY, WEVU_JSX_ISLAND_DATA_KEY, WEVU_JSX_ISLAND_HANDLER, WEVU_JSX_ISLAND_TEMPLATE_NAME, WEVU_LAYOUT_HOSTS_KEY, WEVU_LAYOUT_HOST_ID_PREFIX, WEVU_LAYOUT_HOST_REF_PREFIX, WEVU_MODEL_HANDLER, WEVU_OWNER_HANDLER, WEVU_PROPS_ALIASES_KEY, WEVU_PROPS_DERIVED_KEYS_KEY, WEVU_PROPS_KEY, WEVU_SLOT_FALLBACK_VIRTUAL_HOST_BASE, WEVU_SLOT_FALLBACK_VIRTUAL_HOST_TAG_NAME, WEVU_SLOT_FUNCTION_TOKEN, WEVU_SLOT_NAMES_ATTR, WEVU_SLOT_NAMES_PROP, WEVU_SLOT_OWNER_ID_ATTR, WEVU_SLOT_OWNER_ID_KEY, WEVU_SLOT_OWNER_ID_PROP, WEVU_SLOT_OWNER_KEY, WEVU_SLOT_OWNER_PROXY_KEY, WEVU_SLOT_PROPS_ATTR, WEVU_SLOT_PROPS_DATA_KEY, WEVU_SLOT_PROPS_KEY, WEVU_SLOT_SCOPE_ATTR, WEVU_SLOT_SCOPE_KEY, WEVU_TEMPLATE_REFS_KEY, WEVU_TEMPLATE_REF_CLASS_PREFIX } from "@weapp-core/constants";
+import { WEAPP_I18N_RUNTIME_MARKER, WEAPP_VITE_RUNTIME_REACTIVITY_VIRTUAL_ID, WEAPP_VITE_RUNTIME_TEMPLATE_VIRTUAL_ID, WEAPP_VITE_RUNTIME_VIRTUAL_ID, WEVU_CLASS_STYLE_RUNTIME_FILE, WEVU_CLASS_STYLE_RUNTIME_MODULE, WEVU_CSS_MODULES_KEY, WEVU_CSS_VARS_STYLE_KEY, WEVU_EXPRESSION_ERROR_IDENTIFIER, WEVU_FUNCTION_PROP_PATHS_KEY, WEVU_INLINE_HANDLER, WEVU_INLINE_MAP_KEY, WEVU_IS_PAGE_KEY, WEVU_JSX_ISLAND_DATA_KEY, WEVU_JSX_ISLAND_HANDLER, WEVU_JSX_ISLAND_TEMPLATE_NAME, WEVU_LAYOUT_HOSTS_KEY, WEVU_LAYOUT_HOST_ID_PREFIX, WEVU_LAYOUT_HOST_REF_PREFIX, WEVU_MODEL_HANDLER, WEVU_OWNER_HANDLER, WEVU_PROPS_ALIASES_KEY, WEVU_PROPS_DERIVED_KEYS_KEY, WEVU_PROPS_KEY, WEVU_SLOT_FALLBACK_VIRTUAL_HOST_BASE, WEVU_SLOT_FALLBACK_VIRTUAL_HOST_TAG_NAME, WEVU_SLOT_FUNCTION_TOKEN, WEVU_SLOT_NAMES_ATTR, WEVU_SLOT_NAMES_PROP, WEVU_SLOT_OWNER_ID_ATTR, WEVU_SLOT_OWNER_ID_KEY, WEVU_SLOT_OWNER_ID_PROP, WEVU_SLOT_OWNER_KEY, WEVU_SLOT_OWNER_PROXY_KEY, WEVU_SLOT_PROPS_ATTR, WEVU_SLOT_PROPS_DATA_KEY, WEVU_SLOT_PROPS_KEY, WEVU_SLOT_SCOPE_ATTR, WEVU_SLOT_SCOPE_KEY, WEVU_TEMPLATE_REFS_KEY, WEVU_TEMPLATE_REF_CLASS_PREFIX } from "@weapp-core/constants";
 import { getMiniProgramRuntimeGlobalKeys, getMiniProgramTemplatePreset, removeExtensionDeep } from "@weapp-core/shared";
 import path from "pathe";
 import { NodeTypes, baseParse } from "@vue/compiler-core";
@@ -18,7 +18,7 @@ import { LRUCache } from "lru-cache";
 import { collectJsxImportedComponentsAndDefaultExportFromBabelAst, collectJsxTemplateTagsFromBabelExpression, getObjectPropertyByKey, getRenderPropertyFromComponentOptions, parseJsLikeWithEngine, resolveRenderExpressionFromComponentOptions, toStaticObjectKey, unwrapTypeScriptExpression } from "@weapp-vite/ast";
 import vueJsxPlugin from "@vue/babel-plugin-jsx";
 import { transformSync } from "@weapp-vite/ast/babelCore";
-import { compileScript, parse } from "vue/compiler-sfc";
+import { compileScript, compileStyleAsync, parse } from "vue/compiler-sfc";
 import { fileURLToPath } from "node:url";
 import postcss from "postcss";
 import selectorParser from "postcss-selector-parser";
@@ -2523,6 +2523,8 @@ const INTERNAL_RUNTIME_VALUE_EXPORTS = /* @__PURE__ */ new Set([
 	"triggerRef",
 	"unref",
 	"useAttrs",
+	"useCssModule",
+	"useCssVars",
 	"useAsyncPullDownRefresh",
 	"useBindModel",
 	"useBoundingClientRect",
@@ -2605,6 +2607,8 @@ function createImportVisitors(program, state) {
 				"resolveComponent",
 				"resolveDirective",
 				"useAttrs",
+				"useCssModule",
+				"useCssVars",
 				"useSlots",
 				"useModel",
 				"mergeModels",
@@ -3673,6 +3677,14 @@ function injectFunctionPropPaths(componentOptionsObject, paths) {
 	componentOptionsObject.properties.push(t.objectProperty(t.identifier(WEVU_FUNCTION_PROP_PATHS_KEY), t.arrayExpression(uniquePaths.map((path) => t.stringLiteral(path)))));
 	return true;
 }
+function createObjectLiteral(value) {
+	return t.objectExpression(Object.entries(value).map(([key, item]) => t.objectProperty(t.stringLiteral(key), item && typeof item === "object" && !Array.isArray(item) ? createObjectLiteral(item) : t.valueToNode(item))));
+}
+function injectCssModules(componentOptionsObject, modules) {
+	if (hasStaticProperty(componentOptionsObject, WEVU_CSS_MODULES_KEY)) return false;
+	componentOptionsObject.properties.push(t.objectProperty(t.stringLiteral(WEVU_CSS_MODULES_KEY), createObjectLiteral(modules)));
+	return true;
+}
 function createScopedSlotHostPropertyDefinition(typeName, value) {
 	return t.objectExpression([t.objectProperty(t.identifier("type"), typeName === "String" ? t.identifier("String") : t.nullLiteral()), t.objectProperty(t.identifier("value"), value === null ? t.nullLiteral() : t.stringLiteral(value))]);
 }
@@ -3806,6 +3818,7 @@ function rewriteDefaultExport(ast, state, options, enabledPageFeatures, serializ
 	if (componentOptionsObject) transformed = injectSetupInitialData(componentOptionsObject) || transformed;
 	if (componentOptionsObject && options?.relaxStructuredTypeOnlyProps) transformed = relaxStructuredTypeOnlyProps(componentOptionsObject) || transformed;
 	if (componentOptionsObject && options?.scopedSlotHostProperties) transformed = injectScopedSlotHostProperties(componentOptionsObject) || transformed;
+	if (componentOptionsObject && options?.cssModules && Object.keys(options.cssModules).length) transformed = injectCssModules(componentOptionsObject, options.cssModules) || transformed;
 	if (componentOptionsObject) {
 		transformed = injectPropsAliases(componentOptionsObject, options?.propsAliases) || transformed;
 		transformed = injectPropsDerivedKeys(componentOptionsObject, options?.propsDerivedKeys) || transformed;
@@ -3928,6 +3941,31 @@ function createInlineExpressionId(seed) {
 	return `i${seed.toString(36)}`;
 }
 //#endregion
+//#region src/plugins/vue/compiler/template/expression/numeric.ts
+const DIGIT_NUMERIC_SEPARATOR_RE = /\d_\d/;
+const NON_DECIMAL_NUMERIC_LITERAL_RE = /\b0[bxo][\da-f_]/i;
+const DECIMAL_BIGINT_LITERAL_RE = /\b\d[\d_]*n\b/;
+const NON_DECIMAL_NUMERIC_RAW_RE = /^0[bxo]/i;
+function hasExtendedNumericLiteralSyntax(exp) {
+	return DIGIT_NUMERIC_SEPARATOR_RE.test(exp) || NON_DECIMAL_NUMERIC_LITERAL_RE.test(exp) || DECIMAL_BIGINT_LITERAL_RE.test(exp);
+}
+function serializeBigIntForWxml(value) {
+	const asNumber = Number(value);
+	if (!Number.isSafeInteger(asNumber)) return t.stringLiteral(value.toString());
+	return asNumber < 0 ? t.unaryExpression("-", t.numericLiteral(Math.abs(asNumber))) : t.numericLiteral(asNumber);
+}
+function normalizeTopLevelBigInt(expression) {
+	if (t.isBigIntLiteral(expression)) return serializeBigIntForWxml(BigInt(expression.value));
+	if (t.isUnaryExpression(expression, { operator: "-" }) && t.isBigIntLiteral(expression.argument)) return serializeBigIntForWxml(-BigInt(expression.argument.value));
+	return expression;
+}
+function canonicalizeNumericLiteral(node) {
+	const raw = node.extra?.raw;
+	if (typeof raw !== "string" || !raw.includes("_") && !NON_DECIMAL_NUMERIC_RAW_RE.test(raw)) return;
+	delete node.extra?.raw;
+	delete node.extra?.rawValue;
+}
+//#endregion
 //#region src/plugins/vue/compiler/template/expression/wxml.ts
 function templateLiteralToConcat(node) {
 	const segments = [];
@@ -4027,7 +4065,8 @@ function normalizeWxmlExpression(exp) {
 	const hasTypeScriptSyntax = /\s(?:as|satisfies)\s/.test(exp) || /[\w$)\]]!(?=[.[\s,);:?]|$)/.test(exp) || /^\s*<[^>]+>/.test(exp);
 	const needsVueSlotsRewrite = exp.includes("$slots");
 	const needsThisRewrite = /\bthis\./.test(exp);
-	if (!exp.includes("`") && !exp.includes("??") && !exp.includes("?.") && !hasTypeScriptSyntax && !needsVueSlotsRewrite && !needsThisRewrite) return exp;
+	const needsNumericLiteralRewrite = hasExtendedNumericLiteralSyntax(exp);
+	if (!exp.includes("`") && !exp.includes("??") && !exp.includes("?.") && !hasTypeScriptSyntax && !needsVueSlotsRewrite && !needsThisRewrite && !needsNumericLiteralRewrite) return exp;
 	try {
 		const ast = parse$3(`(${exp})`, {
 			sourceType: "module",
@@ -4036,6 +4075,8 @@ function normalizeWxmlExpression(exp) {
 		const stmt = ast.program.body[0];
 		if (!stmt || !("expression" in stmt)) return exp;
 		if (needsVueSlotsRewrite) rewriteVueSlotsExpression(ast);
+		const expressionStatement = stmt;
+		expressionStatement.expression = normalizeTopLevelBigInt(expressionStatement.expression);
 		traverse(ast, {
 			MemberExpression: { exit(path) {
 				const node = path.node;
@@ -4052,6 +4093,9 @@ function normalizeWxmlExpression(exp) {
 			TSTypeAssertion(path) {
 				path.replaceWith(path.node.expression);
 			},
+			NumericLiteral(path) {
+				canonicalizeNumericLiteral(path.node);
+			},
 			OptionalMemberExpression: { exit(path) {
 				if (isOptionalChainNode(path.parentPath.node)) return;
 				path.replaceWith(lowerOptionalChain(path.node));
@@ -6609,106 +6653,69 @@ function transformNestedWxssVars(source) {
 }
 //#endregion
 //#region src/plugins/vue/compiler/style.ts
-const CSS_RULE_RE = /([^{]+)(\{[^}]*\})/g;
-const CSS_CLASS_RE = /\.([a-z_][\w-]*)(?:\[[^\]]+\])?\s*\{/gi;
+function normalizeStyleError(error) {
+	return error instanceof Error ? error.message : String(error);
+}
+function hasSlottedScopeSelector(source, slottedScopeId) {
+	let found = false;
+	const processor = selectorParser((selectors) => {
+		selectors.walkAttributes((attribute) => {
+			if (attribute.attribute === slottedScopeId) found = true;
+		});
+	});
+	postcss.parse(source).walkRules((rule) => {
+		if (!found) processor.processSync(rule.selector);
+	});
+	return found;
+}
+/**
+* compiler-sfc 已在 scoped 插件中处理 deep 选择器，此函数保留为兼容入口。
+*/
 function transformVueDeepSelectors(source) {
-	if (!source.includes(":deep") && !source.includes("::v-deep")) return source;
 	const root = postcss.parse(source);
 	const processor = selectorParser((selectors) => {
 		selectors.walkTags((tag) => {
-			const name = tag.value.toLowerCase();
-			if (DEFAULT_HTML_TO_WXML_TAG_MAP[name] !== name && DEFAULT_HTML_TO_WXML_TAG_MAP[name]) tag.replaceWith(selectorParser.className({ value: name }));
+			const mapped = DEFAULT_HTML_TO_WXML_TAG_MAP[tag.value.toLowerCase()];
+			if (mapped && mapped !== tag.value.toLowerCase()) tag.replaceWith(selectorParser.className({ value: tag.value.toLowerCase() }));
 		});
 		selectors.walkPseudos((pseudo) => {
-			if (pseudo.value !== ":deep" && pseudo.value !== "::v-deep") return;
+			if (![":deep", "::v-deep"].includes(pseudo.value)) return;
 			const replacement = pseudo.nodes?.[0]?.nodes.map((node) => node.clone()) ?? [];
-			if (replacement.length > 0) pseudo.replaceWith(...replacement);
-			else {
-				const previous = pseudo.prev();
-				const next = pseudo.next();
-				if (next?.type === "combinator" && (!previous || previous.type === "combinator")) next.remove();
-				pseudo.remove();
-			}
+			replacement.length ? pseudo.replaceWith(...replacement) : pseudo.remove();
 		});
 	});
 	root.walkRules((rule) => {
-		if (rule.selector.includes(":deep") || rule.selector.includes("::v-deep")) rule.selector = processor.processSync(rule.selector);
+		rule.selector = processor.processSync(rule.selector).replace(/\s{2,}/g, " ").trim();
 	});
 	return root.toString();
 }
 /**
-* 转换 scoped CSS
-* 为每个选择器添加特定的 scoped 属性
+* 将 Vue SFC style 块编译为可交给 Vite CSS 管线的内容。
 */
-function transformScopedCss(source, id) {
-	const scopedId = `data-v-${id}`;
-	return source.replace(CSS_RULE_RE, (match, selector, rules) => {
-		const trimmedSelector = selector.trim();
-		if (!trimmedSelector) return match;
-		if (trimmedSelector.includes("[") || trimmedSelector.includes(":deep(") || trimmedSelector.includes(":slotted(")) return match;
-		if (trimmedSelector.startsWith("@")) return match;
-		return `${trimmedSelector.split(",").map((s) => {
-			return `${s.trim()}[${scopedId}]`;
-		}).join(", ")} ${rules}`;
+async function compileVueStyleToWxss(styleBlock, options) {
+	const filename = options.filename ?? `style-${options.id}.${styleBlock.lang || "css"}`;
+	const moduleName = typeof styleBlock.module === "string" ? styleBlock.module : typeof options.modules === "string" ? options.modules : "$style";
+	const modules = Boolean(options.modules || styleBlock.module);
+	const result = await compileStyleAsync({
+		filename,
+		id: `data-v-${options.id}`,
+		source: styleBlock.content,
+		scoped: options.transformScoped !== false && Boolean(options.scoped || styleBlock.scoped),
+		modules,
+		modulesOptions: modules ? { generateScopedName: (name) => `${name}_${options.id}` } : void 0,
+		preprocessLang: styleBlock.lang,
+		preprocessOptions: options.preprocessOptions
 	});
-}
-/**
-* 样式转换：CSS → WXSS
-* 处理小程序不支持的 CSS 特性
-*/
-/**
-* 生成简单的 hash
-*/
-function generateHash(str) {
-	let hash = 0;
-	for (let i = 0; i < str.length; i++) {
-		const char = str.charCodeAt(i);
-		hash = (hash << 5) - hash + char;
-		hash = hash & hash;
-	}
-	return Math.abs(hash).toString(36) + str.length.toString(36);
-}
-/**
-* 转换 CSS Modules
-*/
-function transformCssModules(source, id) {
-	const classes = {};
-	const hash = generateHash(id);
-	const classRegex = new RegExp(CSS_CLASS_RE.source, CSS_CLASS_RE.flags);
-	const foundClasses = [];
-	let result = classRegex.exec(source);
-	while (result !== null) {
-		foundClasses.push(result[1]);
-		result = classRegex.exec(source);
-	}
-	for (const className of foundClasses) classes[className] = `${className}_${hash}`;
-	let code = source;
-	for (const [original, scoped] of Object.entries(classes)) {
-		const regex = new RegExp(`\\.${original}\\b`, "g");
-		code = code.replace(regex, `.${scoped}`);
-	}
+	if (result.errors.length) throw new Error(`SFC 样式编译失败（${filename}）：${result.errors.map(normalizeStyleError).join("; ")}`);
 	return {
-		code,
-		classes
+		code: options.preserveDeepSelectors ? result.code : transformVueDeepSelectors(result.code),
+		map: result.map ? JSON.stringify(result.map) : void 0,
+		scopedId: options.scoped || styleBlock.scoped ? `data-v-${options.id}` : void 0,
+		usesSlotted: hasSlottedScopeSelector(result.code, `data-v-${options.id}-s`),
+		modules: result.modules ? { [moduleName]: result.modules } : void 0,
+		dependencies: [...result.dependencies]
 	};
 }
-/**
-* 将 Vue SFC 的 style 块转换为 WXSS
-*/
-function compileVueStyleToWxss(styleBlock, options) {
-	const { id, scoped, modules, preserveDeepSelectors, transformScoped = true } = options;
-	let code = styleBlock.content;
-	if (transformScoped && (scoped || styleBlock.scoped)) code = transformScopedCss(code, id);
-	if (modules || styleBlock.module) {
-		const moduleName = typeof styleBlock.module === "string" ? styleBlock.module : "$style";
-		const moduleResult = transformCssModules(code, id);
-		return {
-			code: preserveDeepSelectors ? moduleResult.code : transformVueDeepSelectors(moduleResult.code),
-			modules: { [moduleName]: moduleResult.classes }
-		};
-	}
-	return { code: preserveDeepSelectors ? code : transformVueDeepSelectors(code) };
-}
 //#endregion
 //#region src/plugins/vue/compiler/template/classStyleRuntime.ts
 /**
@@ -7944,7 +7951,7 @@ function buildForIndexAccess$1(context) {
 /**
 * 检测表达式是否包含小程序模板不稳定的调用语义。
 */
-function shouldFallbackToRuntimeBinding(exp) {
+function shouldFallbackToRuntimeBinding(exp, templateSafeCallNames = /* @__PURE__ */ new Set()) {
 	const trimmed = exp.trim();
 	if (!trimmed) return false;
 	const parsed = parseBabelExpressionFile(normalizeWxmlExpression(trimmed));
@@ -7952,6 +7959,7 @@ function shouldFallbackToRuntimeBinding(exp) {
 	let shouldFallback = false;
 	traverse(parsed.ast, {
 		CallExpression(path) {
+			if (path.node.callee.type === "Identifier" && templateSafeCallNames.has(path.node.callee.name)) return;
 			shouldFallback = true;
 			path.stop();
 		},
@@ -7963,6 +7971,10 @@ function shouldFallbackToRuntimeBinding(exp) {
 			if (path.node.operator !== "typeof") return;
 			shouldFallback = true;
 			path.stop();
+		},
+		BigIntLiteral(path) {
+			shouldFallback = true;
+			path.stop();
 		}
 	});
 	return shouldFallback;
@@ -8291,7 +8303,7 @@ function transformBindDirective(node, context, forInfo, options) {
 		if (context.objectLiteralBindMode === "inline" || isStaticObjectLiteral(rawExpValue)) return createInlineObjectLiteralAttr(argValue, rawExpValue, context);
 		return createBindRuntimeAttr(argValue, rawExpValue, context);
 	}
-	if (shouldFallbackToRuntimeBinding(rawExpValue)) {
+	if (shouldFallbackToRuntimeBinding(rawExpValue, context.templateSafeCallNames)) {
 		const runtimeAttr = createBindRuntimeAttr(argValue, rawExpValue, context);
 		if (runtimeAttr) return runtimeAttr;
 	}
@@ -8557,6 +8569,7 @@ function collectElementAttributes(node, context, options) {
 	const resolvedTag = options?.resolvedTag ?? resolveTemplateTagName(node.tag, context);
 	const isComponentElement = options?.isComponent ?? !isBuiltinTag(resolvedTag);
 	const attrs = options?.extraAttrs ? [...options.extraAttrs] : [];
+	if (context.scopeId) attrs.push(`${context.scopeId}=""`);
 	const mappedTagClass = resolveMappedHtmlTagClassName(node.tag, context, resolvedTag);
 	let staticClass;
 	let staticId;
@@ -8636,7 +8649,7 @@ function collectElementAttributes(node, context, options) {
 			}
 			if (prop.name === "text" && prop.exp?.type === NodeTypes.SIMPLE_EXPRESSION) {
 				const rawExp = prop.exp.content;
-				vTextExp = (shouldFallbackToRuntimeBinding(rawExp) ? registerRuntimeBindingExpression(rawExp, context, { hint: "v-text" }) : null) ?? normalizeWxmlExpressionWithContext(rawExp, context);
+				vTextExp = (shouldFallbackToRuntimeBinding(rawExp, context.templateSafeCallNames) ? registerRuntimeBindingExpression(rawExp, context, { hint: "v-text" }) : null) ?? normalizeWxmlExpressionWithContext(rawExp, context);
 				continue;
 			}
 			const dir = transformDirective(prop, context, node, options?.forInfo, { isComponent: isComponentElement });
@@ -8680,7 +8693,7 @@ function collectElementAttributes(node, context, options) {
 	if (staticId) attrs.unshift(`id="${staticId}"`);
 	const classAttr = renderClassAttribute(staticClass, dynamicClassExp, context);
 	if (classAttr) attrs.unshift(classAttr);
-	const styleAttr = renderStyleAttribute(staticStyle, dynamicStyleExp, vShowExp, context);
+	const styleAttr = renderStyleAttribute(staticStyle, context.cssVars ? dynamicStyleExp ? `[${dynamicStyleExp}, ${WEVU_CSS_VARS_STYLE_KEY}]` : WEVU_CSS_VARS_STYLE_KEY : dynamicStyleExp, vShowExp, context);
 	if (styleAttr) attrs.unshift(styleAttr);
 	return {
 		attrs,
@@ -9039,6 +9052,7 @@ function renderPlainSlotOutlet(node, context, transformNode) {
 	if (hasScopeBindings) context.warnings.push("已禁用作用域插槽参数，插槽绑定将被忽略。");
 	const fallbackContent = node.children.map((child) => transformNode(child, context)).join("");
 	const slotAttrs = [];
+	if (context.slottedScopeId) slotAttrs.push(`${context.slottedScopeId}=""`);
 	const nameAttr = renderSlotNameAttribute(slotNameInfo, context, "name");
 	if (nameAttr) slotAttrs.push(nameAttr);
 	const slotAttrString = slotAttrs.length ? ` ${slotAttrs.join(" ")}` : "";
@@ -9103,6 +9117,7 @@ function transformSlotElement(node, context, transformNode) {
 	let fallbackContent = "";
 	if (node.children.length > 0) fallbackContent = node.children.map((child) => transformNode(child, context)).join("");
 	const slotAttrs = [];
+	if (context.slottedScopeId) slotAttrs.push(`${context.slottedScopeId}=""`);
 	const nameAttr = renderSlotNameAttribute(slotNameInfo, context, "name");
 	if (nameAttr) slotAttrs.push(nameAttr);
 	const slotAttrString = slotAttrs.length ? ` ${slotAttrs.join(" ")}` : "";
@@ -9122,6 +9137,7 @@ function transformSlotElement(node, context, transformNode) {
 		`${WEVU_SLOT_OWNER_ID_ATTR}="${renderMustache(WEVU_SLOT_OWNER_ID_PROP, context)}"`,
 		`${WEVU_SLOT_PROPS_ATTR}="${renderMustache(slotPropsExp, context)}"`
 	];
+	if (context.slottedScopeId) scopedAttrs.push(`${context.slottedScopeId}=""`);
 	if (context.slotMultipleInstance) scopedAttrs.push(`${WEVU_SLOT_SCOPE_ATTR}="${renderMustache(WEVU_SLOT_SCOPE_KEY, context)}"`);
 	const scopedTag = `<${genericKey}${scopedAttrs.length ? ` ${scopedAttrs.join(" ")}` : ""} />`;
 	const nativeFallbackTag = context.forStack.length > 0 ? "" : context.platform.wrapIf(`!${WEVU_SLOT_OWNER_ID_PROP}`, slotTag, (exp) => renderMustache(exp, context));
@@ -9598,10 +9614,10 @@ function transformNormalElement(node, context, transformNode) {
 //#region src/plugins/vue/compiler/template/elements/tag-structural.ts
 const REGEX_SPECIAL_CHARS_RE = /[.*+?^${}()|[\]\\]/g;
 function resolveConditionExpression$1(rawExpValue, context, hint) {
-	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
+	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue, context.templateSafeCallNames) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
 }
 function resolveListExpression(rawExpValue, context, hint) {
-	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
+	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue, context.templateSafeCallNames) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
 }
 function transformIfElement(node, context, transformNode) {
 	const renderTemplateMustache = (exp) => renderMustache(exp, context);
@@ -9705,7 +9721,7 @@ function transformForElement(node, context, transformNode) {
 const TEMPLATE_OPEN_RE = /<template/g;
 const TEMPLATE_CLOSE_RE = /<\/template>/g;
 function resolveConditionExpression(rawExpValue, context, hint) {
-	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
+	return (context.rewriteScopedSlot || shouldFallbackToRuntimeBinding(rawExpValue, context.templateSafeCallNames) ? registerRuntimeBindingExpression(rawExpValue, context, { hint }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context);
 }
 function transformTransitionElement(node, context, transformNode) {
 	context.warnings.push("<transition> 组件：过渡效果需要动画库或运行时支持，仅渲染子节点。");
@@ -9806,7 +9822,7 @@ function transformInterpolation(node, context) {
 	const { content } = node;
 	if (content.type === NodeTypes.SIMPLE_EXPRESSION) {
 		const rawExpValue = content.content;
-		return renderMustache((shouldFallbackToRuntimeBinding(rawExpValue) ? registerRuntimeBindingExpression(rawExpValue, context, { hint: "插值表达式" }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context), context);
+		return renderMustache((shouldFallbackToRuntimeBinding(rawExpValue, context.templateSafeCallNames) ? registerRuntimeBindingExpression(rawExpValue, context, { hint: "插值表达式" }) : null) ?? normalizeWxmlExpressionWithContext(rawExpValue, context), context);
 	}
 	/* istanbul ignore next */
 	return renderMustache("", context);
@@ -9929,8 +9945,12 @@ function compileVueTemplateToWxml(template, filename, options) {
 			inlineExpressionSeed: 0,
 			functionPropPaths: /* @__PURE__ */ new Set(),
 			functionPropNames: Array.from(options?.functionPropNames ?? []),
+			templateSafeCallNames: new Set(options?.templateSafeCallNames ?? []),
 			wevuComponentTags: options?.wevuComponentTags ? new Set(options.wevuComponentTags) : void 0,
-			miniProgramComponentTags: options?.miniProgramComponentTags ? new Set(options.miniProgramComponentTags) : void 0
+			miniProgramComponentTags: options?.miniProgramComponentTags ? new Set(options.miniProgramComponentTags) : void 0,
+			scopeId: options?.scopeId,
+			slottedScopeId: options?.slottedScopeId,
+			cssVars: options?.cssVars
 		};
 		let wxml = ast.children.map((child) => transformNode(child, context)).join("");
 		if (context.classStyleWxs) wxml = `${buildClassStyleWxsTag(context.classStyleWxsExtension || "wxs", context.classStyleWxsSrc)}\n${wxml}`;
@@ -9961,6 +9981,25 @@ function compileVueTemplateToWxml(template, filename, options) {
 	}
 }
 //#endregion
+//#region src/plugins/vue/transform/scopedId.ts
+const SOURCE_ROOT_RE = /(?:^|\/)src\/(.+)$/;
+function normalizeScopedIdInput(filename) {
+	const normalized = filename.replace(/\\/g, "/");
+	return normalized.match(SOURCE_ROOT_RE)?.[1] ?? normalized.replace(/^.*?\/(pages|components|layouts)\//, "$1/");
+}
+/**
+* 根据项目内相对路径生成跨机器稳定的 scoped ID。
+*/
+function generateScopedId(filename) {
+	const input = normalizeScopedIdInput(filename);
+	let hash = 2166136261;
+	for (let index = 0; index < input.length; index += 1) {
+		hash ^= input.charCodeAt(index);
+		hash = Math.imul(hash, 16777619);
+	}
+	return (hash >>> 0).toString(36);
+}
+//#endregion
 //#region src/ast/native.ts
 const require = createRequire(import.meta.url);
 let binding;
@@ -10568,6 +10607,10 @@ const OBJECT_TO_STRING = Object.prototype.toString;
 function isIdentifierLikeKey(key) {
 	return IDENTIFIER_LIKE_KEY_RE.test(key);
 }
+function resolveRuntimeMarkerIdentifier(value, scopeValues) {
+	if (value[WEAPP_I18N_RUNTIME_MARKER] !== true) return;
+	return Object.entries(scopeValues).find(([name, scopeValue]) => isIdentifierLikeKey(name) && scopeValue === value)?.[0];
+}
 function getObjectTag(value) {
 	return OBJECT_TO_STRING.call(value);
 }
@@ -10665,6 +10708,8 @@ function serializeStaticValueToExpression(value, seen = /* @__PURE__ */ new Weak
 	if (getObjectTag(value) === "[object RegExp]") return value.toString();
 	if (Array.isArray(value)) return `[${value.map((item) => serializeStaticValueToExpression(item, seen, scopeValues)).join(", ")}]`;
 	if (value && typeof value === "object") {
+		const runtimeIdentifier = resolveRuntimeMarkerIdentifier(value, scopeValues);
+		if (runtimeIdentifier) return runtimeIdentifier;
 		if (seen.has(value)) throw new Error("defineOptions 的参数中不支持循环引用。");
 		seen.add(value);
 		const proto = Object.getPrototypeOf(value);
@@ -11311,7 +11356,7 @@ async function compileScriptPhase(descriptor, descriptorForCompile, filename, op
 	let propsDerivedKeys;
 	if (descriptor.script || descriptor.scriptSetup) {
 		const scriptCompiled = precompiledScript ?? compileScript(descriptorForCompile, {
-			id: filename,
+			id: generateScopedId(filename),
 			isProd: false
 		});
 		warnReservedScriptSetupProps(descriptorForCompile.scriptSetup?.content, options?.warn, {
@@ -11356,6 +11401,7 @@ async function compileScriptPhase(descriptor, descriptorForCompile, filename, op
 			functionPropPaths: templateCompiled?.functionPropPaths,
 			propsAliases,
 			propsDerivedKeys,
+			cssModules: precomputedScriptPhaseInfo?.cssModules,
 			relaxStructuredTypeOnlyProps,
 			scopedSlotHostProperties: Boolean(templateCompiled?.componentGenerics && Object.keys(templateCompiled.componentGenerics).length > 0)
 		});
@@ -11376,42 +11422,29 @@ async function compileScriptPhase(descriptor, descriptorForCompile, filename, op
 	};
 }
 //#endregion
-//#region src/plugins/vue/transform/scopedId.ts
-/**
-* 生成 scoped ID
-*/
-function generateScopedId(filename) {
-	const hash = filename.split("").reduce((acc, char) => {
-		return (acc << 5) - acc + char.charCodeAt(0);
-	}, 0);
-	return Math.abs(hash).toString(36);
-}
-//#endregion
 //#region src/plugins/vue/transform/compileVueFile/style.ts
-function compileStylePhase(descriptor, filename, result, options) {
-	if (descriptor.styles.length === 0) return;
+async function compileStylePhase(descriptor, filename, result, options) {
+	if (descriptor.styles.length === 0) return { usesSlotted: false };
 	const scopedId = generateScopedId(filename);
-	const compiledStyles = descriptor.styles.map((styleBlock) => {
-		return compileVueStyleToWxss(styleBlock, {
+	const compiledStyles = await Promise.all(descriptor.styles.map(async (styleBlock) => {
+		return await compileVueStyleToWxss(styleBlock, {
 			id: scopedId,
+			filename,
 			scoped: styleBlock.scoped,
 			modules: styleBlock.module,
+			preprocessOptions: options?.preprocessOptions?.[styleBlock.lang || "css"],
 			preserveDeepSelectors: options?.preserveDeepSelectors,
 			transformScoped: options?.transformScoped
 		});
-	});
+	}));
 	result.style = compiledStyles.map((s) => s.code.trim()).filter(Boolean).join("\n\n");
-	if (!compiledStyles.some((s) => s.modules)) return;
+	if (!compiledStyles.some((s) => s.modules)) return { usesSlotted: compiledStyles.some((style) => style.usesSlotted) };
 	const modulesMap = {};
 	compiledStyles.forEach((compiled) => {
 		if (compiled.modules) Object.assign(modulesMap, compiled.modules);
 	});
 	result.cssModules = modulesMap;
-	if (result.script !== void 0) result.script = `
-// 模块化样式（CSS Modules）
-const __cssModules = ${JSON.stringify(modulesMap, null, 2)}
-${result.script}
-`;
+	return { usesSlotted: compiledStyles.some((style) => style.usesSlotted) };
 }
 //#endregion
 //#region src/plugins/vue/transform/compileVueFile/template.ts
@@ -11471,6 +11504,7 @@ async function refreshVueFileJsonConfig(source, filename, cachedResult, options)
 */
 async function compileVueFile(source, filename, options) {
 	const parsed = await parseVueFile(source, filename, options);
+	const sfcId = generateScopedId(filename);
 	const result = { meta: {
 		...parsed.meta,
 		styleBlocks: parsed.descriptor.styles
@@ -11486,24 +11520,32 @@ async function compileVueFile(source, filename, options) {
 		autoImportTags
 	});
 	const scriptCompiled = parsed.descriptor.script || parsed.descriptor.scriptSetup ? compileScript(parsed.descriptorForCompile, {
-		id: filename,
+		id: sfcId,
 		isProd: false
 	}) : void 0;
 	const propsAliases = scriptCompiled ? resolveScriptSetupPropsAliases(scriptCompiled.bindings) : void 0;
 	const propsDerivedKeys = scriptCompiled ? resolveEffectivePropsDerivedKeys(scriptCompiled.bindings, scriptCompiled.content) : void 0;
+	const styleCompiled = await compileStylePhase(parsed.descriptor, filename, result, options?.style);
+	const scopedId = parsed.descriptor.styles.some((style) => style.scoped) ? `data-v-${sfcId}` : void 0;
 	const baseTemplateOptions = parsed.isAppFile ? {
 		...options?.template,
 		isPage: options?.isPage,
 		propsAliases,
 		propsDerivedKeys,
 		scriptSetupBindings: scriptCompiled?.bindings,
-		scopedSlotsRequireProps: true
+		scopedSlotsRequireProps: true,
+		scopeId: scopedId,
+		slottedScopeId: scopedId && styleCompiled.usesSlotted ? `${scopedId}-s` : void 0,
+		cssVars: parsed.descriptor.cssVars.length > 0
 	} : {
 		...options?.template,
 		isPage: options?.isPage,
 		propsAliases,
 		propsDerivedKeys,
-		scriptSetupBindings: scriptCompiled?.bindings
+		scriptSetupBindings: scriptCompiled?.bindings,
+		scopeId: scopedId,
+		slottedScopeId: scopedId && styleCompiled.usesSlotted ? `${scopedId}-s` : void 0,
+		cssVars: parsed.descriptor.cssVars.length > 0
 	};
 	const templateOptions = componentSourceInfo.wevuComponentTags.size ? {
 		...baseTemplateOptions,
@@ -11519,12 +11561,12 @@ async function compileVueFile(source, filename, options) {
 	const templateCompiled = compileTemplatePhase(parsed.descriptor, filename, templateOptions, result);
 	const scriptPhase = await compileScriptPhase(parsed.descriptor, parsed.descriptorForCompile, filename, options, autoUsingComponents, templateCompiled, parsed.isAppFile, componentSourceInfo, scriptCompiled, {
 		propsAliases,
-		propsDerivedKeys
+		propsDerivedKeys,
+		cssModules: result.cssModules
 	});
 	result.script = scriptPhase.script;
 	result.scriptMap = scriptPhase.scriptMap;
 	if (scriptPhase.template) result.template = scriptPhase.template;
-	compileStylePhase(parsed.descriptor, filename, result, options?.style);
 	await compileConfigPhase({
 		descriptor: parsed.descriptor,
 		filename,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@wevu/compiler",
   "type": "module",
-  "version": "6.21.0",
+  "version": "6.22.0",
   "description": "wevu 编译器基础包，面向小程序模板的编译与转换",
   "author": "ice breaker <1324318532@qq.com>",
   "license": "MIT",
@@ -53,10 +53,10 @@
     "postcss": "^8.5.26",
     "postcss-selector-parser": "^7.1.5",
     "vue": "^3.5.41",
-    "@weapp-core/constants": "0.1.17",
+    "@weapp-core/constants": "0.2.0",
+    "@weapp-vite/ast": "6.22.0",
     "@weapp-core/shared": "3.1.1",
-    "rolldown-require": "2.0.26",
-    "@weapp-vite/ast": "6.21.0"
+    "rolldown-require": "2.0.26"
   },
   "publishConfig": {
     "access": "public",