fix(compiler-core): avoid self updates of v-pre (#12556)

KazariEX · web-flow · commit 21b685ad9d9d · 2025-07-18T16:22:56.000+08:00
diff --git a/packages/compiler-core/src/parser.ts b/packages/compiler-core/src/parser.ts
@@ -43,6 +43,7 @@ import {
   isCoreComponent,
   isSimpleIdentifier,
   isStaticArgOf,
+  isVPre,
 } from './utils'
 import { decodeHTML } from 'entities/lib/decode.js'
 import {
@@ -246,7 +247,7 @@ const tokenizer = new Tokenizer(stack, {
   ondirarg(start, end) {
     if (start === end) return
     const arg = getSlice(start, end)
-    if (inVPre) {
+    if (inVPre && !isVPre(currentProp!)) {
       ;(currentProp as AttributeNode).name += arg
       setLocEnd((currentProp as AttributeNode).nameLoc, end)
     } else {
@@ -262,7 +263,7 @@ const tokenizer = new Tokenizer(stack, {
 
   ondirmodifier(start, end) {
     const mod = getSlice(start, end)
-    if (inVPre) {
+    if (inVPre && !isVPre(currentProp!)) {
       ;(currentProp as AttributeNode).name += '.' + mod
       setLocEnd((currentProp as AttributeNode).nameLoc, end)
     } else if ((currentProp as DirectiveNode).name === 'slot') {
diff --git a/packages/compiler-core/src/utils.ts b/packages/compiler-core/src/utils.ts
@@ -343,6 +343,10 @@ export function isText(
   return node.type === NodeTypes.INTERPOLATION || node.type === NodeTypes.TEXT
 }
 
+export function isVPre(p: ElementNode['props'][0]): p is DirectiveNode {
+  return p.type === NodeTypes.DIRECTIVE && p.name === 'pre'
+}
+
 export function isVSlot(p: ElementNode['props'][0]): p is DirectiveNode {
   return p.type === NodeTypes.DIRECTIVE && p.name === 'slot'
 }

Original file line number	Diff line number	Diff line change
`@@ -343,6 +343,10 @@ export function isText(`
`343`	`343`	`return node.type === NodeTypes.INTERPOLATION \|\| node.type === NodeTypes.TEXT`
`344`	`344`	`}`
`345`	`345`
	`346`	`+export function isVPre(p: ElementNode['props'][0]): p is DirectiveNode {`
	`347`	`+ return p.type === NodeTypes.DIRECTIVE && p.name === 'pre'`
	`348`	`+}`
	`349`	`+`
`346`	`350`	`export function isVSlot(p: ElementNode['props'][0]): p is DirectiveNode {`
`347`	`351`	`return p.type === NodeTypes.DIRECTIVE && p.name === 'slot'`
`348`	`352`	`}`