From a4128323d3680ddae5d35bca57e62c6c4cde1c6f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Sat, 10 Jun 2023 20:21:27 +0800
Subject: [PATCH 1/4] fix(compiler-sfc): don't hoist props and emit

closes #7812
---
 .../__snapshots__/compileScript.spec.ts.snap  | 31 +++++----
 .../__tests__/compileScript.spec.ts           | 11 +++-
 .../__snapshots__/defineEmits.spec.ts.snap    | 64 +++++++++----------
 .../__snapshots__/defineProps.spec.ts.snap    | 48 ++++----------
 .../definePropsDestructure.spec.ts.snap       |  4 +-
 .../compileScript/defineEmits.spec.ts         |  6 +-
 packages/compiler-sfc/src/compileScript.ts    | 55 ++++++++++------
 packages/compiler-sfc/src/script/context.ts   |  8 ++-
 .../compiler-sfc/src/script/defineEmits.ts    |  6 +-
 .../compiler-sfc/src/script/defineProps.ts    | 55 ++++++++--------
 .../src/script/definePropsDestructure.ts      |  1 -
 11 files changed, 142 insertions(+), 147 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index 18b5d90eaf6..97150312eb0 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -616,12 +616,11 @@ exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable
 "export default {
   props: ['item'],
   emits: ['a'],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props,
+          emit = __emit;
     
 return { props, emit }
 }
@@ -633,12 +632,12 @@ exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable
 "export default {
   props: ['item'],
   emits: ['a'],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-const props = __props;
-
-    const a = 1;
+    const props = __props,
+      a = 1,
+      emit = __emit;
     
 return { props, a, emit }
 }
@@ -650,12 +649,12 @@ exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable
 "export default {
   props: ['item'],
   emits: ['a'],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-const props = __props;
-
-    const a = 1;
+    const a = 1,
+          props = __props,
+          emit = __emit;
     
 return { a, props, emit }
 }
@@ -667,12 +666,12 @@ exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable
 "export default {
   props: ['item'],
   emits: ['foo'],
-  setup(__props, { expose: __expose, emit: emits }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-const props = __props;
-
-    const a = 0,
+    const props = __props,
+          emits = __emit,
+          a = 0,
           b = 0;
     
 return { props, emits, a, b }
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index 6da274dd8a5..35664290191 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -77,7 +77,9 @@ describe('SFC compile <script setup>', () => {
     </script>
   `)
     assertCode(content)
-    expect(content).toMatch(`const a = 1;`) // test correct removal
+    expect(content).toMatch(`const props = __props,`)
+    expect(content).toMatch(`a = 1,`)
+    expect(content).toMatch(`emit = __emit;`)
     expect(content).toMatch(`props: ['item'],`)
     expect(content).toMatch(`emits: ['a'],`)
   })
@@ -92,7 +94,9 @@ describe('SFC compile <script setup>', () => {
     </script>
   `)
     assertCode(content)
-    expect(content).toMatch(`const a = 1;`) // test correct removal
+    expect(content).toMatch(`const a = 1,`)
+    expect(content).toMatch(`props = __props,`)
+    expect(content).toMatch(`emit = __emit;`)
     expect(content).toMatch(`props: ['item'],`)
     expect(content).toMatch(`emits: ['a'],`)
   })
@@ -110,7 +114,8 @@ describe('SFC compile <script setup>', () => {
     assertCode(content)
     expect(content).toMatch(`props: ['item'],`)
     expect(content).toMatch(`emits: ['foo'],`)
-    expect(content).toMatch(`const a = 0,`)
+    expect(content).toMatch(`const props = __props,`)
+    expect(content).toMatch(`a = 0,`)
     expect(content).toMatch(`b = 0;`)
   })
 
diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineEmits.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineEmits.spec.ts.snap
index a8bd930fbbc..1e851cbf4df 100644
--- a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineEmits.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineEmits.spec.ts.snap
@@ -3,10 +3,10 @@
 exports[`defineEmits > basic usage 1`] = `
 "export default {
   emits: ['foo', 'bar'],
-  setup(__props, { expose: __expose, emit: myEmit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-
+const myEmit = __emit
 
 return { myEmit }
 }
@@ -19,10 +19,10 @@ exports[`defineEmits > w/ runtime options 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: ['a', 'b'],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-
+const emit = __emit
 
 return { emit }
 }
@@ -36,10 +36,10 @@ export interface Emits { (e: 'foo' | 'bar'): void }
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -53,10 +53,10 @@ export type Emits = { (e: 'foo' | 'bar'): void }
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -70,10 +70,10 @@ interface Emits { (e: 'foo'): void }
     
 export default /*#__PURE__*/_defineComponent({
   emits: ['foo'],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit: Emits = __emit
     
 return { emit }
 }
@@ -87,10 +87,10 @@ interface Emits { (e: 'foo' | 'bar'): void }
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -103,10 +103,10 @@ exports[`defineEmits > w/ type (property syntax string literal) 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo:bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -119,10 +119,10 @@ exports[`defineEmits > w/ type (property syntax) 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -136,10 +136,10 @@ export type Emits = (e: 'foo' | 'bar') => void
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -153,10 +153,10 @@ type Emits = (e: 'foo' | 'bar') => void
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -170,10 +170,10 @@ type Emits = { (e: 'foo' | 'bar'): void }
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -186,10 +186,10 @@ exports[`defineEmits > w/ type (type literal w/ call signatures) 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\", \\"baz\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -204,10 +204,10 @@ type BaseEmit = \\"change\\"
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"some\\", \\"emit\\", \\"change\\", \\"another\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit;
     
 return { emit }
 }
@@ -220,10 +220,10 @@ exports[`defineEmits > w/ type (union) 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\", \\"baz\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -236,10 +236,10 @@ exports[`defineEmits > w/ type 1`] = `
 
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
@@ -254,10 +254,10 @@ exports[`defineEmits > w/ type from normal script 1`] = `
     
 export default /*#__PURE__*/_defineComponent({
   emits: [\\"foo\\", \\"bar\\"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
   __expose();
 
-    
+    const emit = __emit
     
 return { emit }
 }
diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap
index 62d9bef5d27..30e00e518b2 100644
--- a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap
@@ -10,9 +10,7 @@ export default {
   setup(__props, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-
+const props = __props
 
 return { props, bar }
 }
@@ -28,9 +26,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-
+const props = __props
 
 return { props }
 }
@@ -48,9 +44,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const { foo } = __props;
-
-      
+      const { foo } = __props
       
 return {  }
 }
@@ -167,9 +161,7 @@ export default {
   setup(__props, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props, get propsModel() { return propsModel } }
 }
@@ -203,9 +195,7 @@ export default {
   props: {},
   setup(__props, { expose: __expose }) {
   __expose();
-
-const props = __props;
-
+const props = __props
     
 return { props, get x() { return x } }
 }
@@ -304,9 +294,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props, get defaults() { return defaults } }
 }
@@ -328,9 +316,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props, get defaults() { return defaults } }
 }
@@ -351,9 +337,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props, get defaults() { return defaults } }
 }
@@ -375,9 +359,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-      
+      const props = __props;
     
 return { props }
 }
@@ -401,9 +383,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props }
 }
@@ -424,9 +404,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props }
 }
@@ -446,9 +424,7 @@ export default /*#__PURE__*/_defineComponent({
   setup(__props: any, { expose: __expose }) {
   __expose();
 
-const props = __props;
-
-    
+    const props = __props
     
 return { props }
 }
diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
index 721ef7eaa54..ce12fe49ad7 100644
--- a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
@@ -237,9 +237,7 @@ export default {
   props: ['foo', 'bar', 'baz'],
   setup(__props) {
 
-const rest = _createPropsRestProxy(__props, [\\"foo\\",\\"bar\\"]);
-
-      
+      const rest = _createPropsRestProxy(__props, [\\"foo\\",\\"bar\\"])
       
 return () => {}
 }
diff --git a/packages/compiler-sfc/__tests__/compileScript/defineEmits.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineEmits.spec.ts
index c5d2900a4e7..13b981db3d7 100644
--- a/packages/compiler-sfc/__tests__/compileScript/defineEmits.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript/defineEmits.spec.ts
@@ -16,8 +16,9 @@ const myEmit = defineEmits(['foo', 'bar'])
     expect(content).not.toMatch('defineEmits')
     // should generate correct setup signature
     expect(content).toMatch(
-      `setup(__props, { expose: __expose, emit: myEmit }) {`
+      `setup(__props, { expose: __expose, emit: __emit }) {`
     )
+    expect(content).toMatch('const myEmit = __emit')
     // should include context options in default export
     expect(content).toMatch(`export default {
   emits: ['foo', 'bar'],`)
@@ -32,7 +33,8 @@ const emit = defineEmits(['a', 'b'])
     assertCode(content)
     expect(content).toMatch(`export default /*#__PURE__*/_defineComponent({
   emits: ['a', 'b'],
-  setup(__props, { expose: __expose, emit }) {`)
+  setup(__props, { expose: __expose, emit: __emit }) {`)
+    expect(content).toMatch('const emit = __emit')
   })
 
   test('w/ type', () => {
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 2c15b7f496e..14e882cb86e 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -552,7 +552,11 @@ export function compileScript(
             (processDefineSlots(ctx, init, decl.id) ||
               processDefineModel(ctx, init, decl.id))
 
-          if (isDefineProps || isDefineEmits) {
+          if (
+            isDefineProps &&
+            !ctx.propsDestructureRestId &&
+            ctx.propsDestructureDecl
+          ) {
             if (left === 1) {
               ctx.s.remove(node.start! + startOffset, node.end! + startOffset)
             } else {
@@ -570,6 +574,12 @@ export function compileScript(
               ctx.s.remove(start, end)
               left--
             }
+          } else if (isDefineEmits) {
+            ctx.s.overwrite(
+              startOffset + init.start!,
+              startOffset + init.end!,
+              '__emit'
+            )
           } else {
             lastNonRemoved = i
           }
@@ -781,22 +791,29 @@ export function compileScript(
   // inject user assignment of props
   // we use a default __props so that template expressions referencing props
   // can use it directly
-  if (ctx.propsIdentifier) {
-    ctx.s.prependLeft(
-      startOffset,
-      `\nconst ${ctx.propsIdentifier} = __props;\n`
-    )
-  }
-  if (ctx.propsDestructureRestId) {
-    ctx.s.prependLeft(
-      startOffset,
-      `\nconst ${ctx.propsDestructureRestId} = ${ctx.helper(
-        `createPropsRestProxy`
-      )}(__props, ${JSON.stringify(
-        Object.keys(ctx.propsDestructuredBindings)
-      )});\n`
-    )
+  if (ctx.propsDecl) {
+    if (ctx.propsDestructureRestId) {
+      ctx.s.overwrite(
+        startOffset + ctx.propsCall!.start!,
+        startOffset + ctx.propsCall!.end!,
+        `${ctx.helper(`createPropsRestProxy`)}(__props, ${JSON.stringify(
+          Object.keys(ctx.propsDestructuredBindings)
+        )})`
+      )
+      ctx.s.overwrite(
+        startOffset + ctx.propsDestructureDecl!.start!,
+        startOffset + ctx.propsDestructureDecl!.end!,
+        ctx.propsDestructureRestId
+      )
+    } else if (!ctx.propsDestructureDecl) {
+      ctx.s.overwrite(
+        startOffset + ctx.propsCall!.start!,
+        startOffset + ctx.propsCall!.end!,
+        '__props'
+      )
+    }
   }
+
   // inject temp variables for async context preservation
   if (hasAwait) {
     const any = ctx.isTS ? `: any` : ``
@@ -807,10 +824,8 @@ export function compileScript(
     ctx.hasDefineExposeCall || !options.inlineTemplate
       ? [`expose: __expose`]
       : []
-  if (ctx.emitIdentifier) {
-    destructureElements.push(
-      ctx.emitIdentifier === `emit` ? `emit` : `emit: ${ctx.emitIdentifier}`
-    )
+  if (ctx.emitDecl) {
+    destructureElements.push(`emit: __emit`)
   }
   if (destructureElements.length) {
     args += `, { ${destructureElements.join(', ')} }`
diff --git a/packages/compiler-sfc/src/script/context.ts b/packages/compiler-sfc/src/script/context.ts
index af2dee16568..1a5a21c8db9 100644
--- a/packages/compiler-sfc/src/script/context.ts
+++ b/packages/compiler-sfc/src/script/context.ts
@@ -1,4 +1,4 @@
-import { Node, ObjectPattern, Program } from '@babel/types'
+import { CallExpression, Node, ObjectPattern, Program } from '@babel/types'
 import { SFCDescriptor } from '../parse'
 import { generateCodeFrame } from '@vue/shared'
 import { parse as babelParse, ParserPlugin } from '@babel/parser'
@@ -38,7 +38,8 @@ export class ScriptCompileContext {
   hasDefineModelCall = false
 
   // defineProps
-  propsIdentifier: string | undefined
+  propsCall: CallExpression | undefined
+  propsDecl: Node | undefined
   propsRuntimeDecl: Node | undefined
   propsTypeDecl: Node | undefined
   propsDestructureDecl: ObjectPattern | undefined
@@ -47,9 +48,10 @@ export class ScriptCompileContext {
   propsRuntimeDefaults: Node | undefined
 
   // defineEmits
+  emitsCall: CallExpression | undefined
+  emitDecl: Node | undefined
   emitsRuntimeDecl: Node | undefined
   emitsTypeDecl: Node | undefined
-  emitIdentifier: string | undefined
 
   // defineModel
   modelDecls: Record<string, ModelDecl> = {}
diff --git a/packages/compiler-sfc/src/script/defineEmits.ts b/packages/compiler-sfc/src/script/defineEmits.ts
index a50cf91fc4a..6eb6c10ff85 100644
--- a/packages/compiler-sfc/src/script/defineEmits.ts
+++ b/packages/compiler-sfc/src/script/defineEmits.ts
@@ -29,10 +29,8 @@ export function processDefineEmits(
     ctx.emitsTypeDecl = node.typeParameters.params[0]
   }
 
-  if (declId) {
-    ctx.emitIdentifier =
-      declId.type === 'Identifier' ? declId.name : ctx.getString(declId)
-  }
+  ctx.emitsCall = node
+  ctx.emitDecl = declId
 
   return true
 }
diff --git a/packages/compiler-sfc/src/script/defineProps.ts b/packages/compiler-sfc/src/script/defineProps.ts
index 1ae5a16e3d6..5004e314da1 100644
--- a/packages/compiler-sfc/src/script/defineProps.ts
+++ b/packages/compiler-sfc/src/script/defineProps.ts
@@ -77,15 +77,14 @@ export function processDefineProps(
     ctx.propsTypeDecl = node.typeParameters.params[0]
   }
 
-  if (declId) {
-    // handle props destructure
-    if (declId.type === 'ObjectPattern') {
-      processPropsDestructure(ctx, declId)
-    } else {
-      ctx.propsIdentifier = ctx.getString(declId)
-    }
+  // handle props destructure
+  if (declId && declId.type === 'ObjectPattern') {
+    processPropsDestructure(ctx, declId)
   }
 
+  ctx.propsCall = node
+  ctx.propsDecl = declId
+
   return true
 }
 
@@ -97,31 +96,33 @@ function processWithDefaults(
   if (!isCallOf(node, WITH_DEFAULTS)) {
     return false
   }
-  if (processDefineProps(ctx, node.arguments[0], declId)) {
-    if (ctx.propsRuntimeDecl) {
-      ctx.error(
-        `${WITH_DEFAULTS} can only be used with type-based ` +
-          `${DEFINE_PROPS} declaration.`,
-        node
-      )
-    }
-    if (ctx.propsDestructureDecl) {
-      ctx.error(
-        `${WITH_DEFAULTS}() is unnecessary when using destructure with ${DEFINE_PROPS}().\n` +
-          `Prefer using destructure default values, e.g. const { foo = 1 } = defineProps(...).`,
-        node.callee
-      )
-    }
-    ctx.propsRuntimeDefaults = node.arguments[1]
-    if (!ctx.propsRuntimeDefaults) {
-      ctx.error(`The 2nd argument of ${WITH_DEFAULTS} is required.`, node)
-    }
-  } else {
+  if (!processDefineProps(ctx, node.arguments[0], declId)) {
     ctx.error(
       `${WITH_DEFAULTS}' first argument must be a ${DEFINE_PROPS} call.`,
       node.arguments[0] || node
     )
   }
+
+  if (ctx.propsRuntimeDecl) {
+    ctx.error(
+      `${WITH_DEFAULTS} can only be used with type-based ` +
+        `${DEFINE_PROPS} declaration.`,
+      node
+    )
+  }
+  if (ctx.propsDestructureDecl) {
+    ctx.error(
+      `${WITH_DEFAULTS}() is unnecessary when using destructure with ${DEFINE_PROPS}().\n` +
+        `Prefer using destructure default values, e.g. const { foo = 1 } = defineProps(...).`,
+      node.callee
+    )
+  }
+  ctx.propsRuntimeDefaults = node.arguments[1]
+  if (!ctx.propsRuntimeDefaults) {
+    ctx.error(`The 2nd argument of ${WITH_DEFAULTS} is required.`, node)
+  }
+  ctx.propsCall = node
+
   return true
 }
 
diff --git a/packages/compiler-sfc/src/script/definePropsDestructure.ts b/packages/compiler-sfc/src/script/definePropsDestructure.ts
index a81b4a5c5cb..f6fdaf87218 100644
--- a/packages/compiler-sfc/src/script/definePropsDestructure.ts
+++ b/packages/compiler-sfc/src/script/definePropsDestructure.ts
@@ -28,7 +28,6 @@ export function processPropsDestructure(
   declId: ObjectPattern
 ) {
   if (!ctx.options.propsDestructure && !ctx.options.reactivityTransform) {
-    ctx.propsIdentifier = ctx.getString(declId)
     return
   }
 

From 1cd42464d775cd966dbe45128aa3a38271660819 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Sat, 10 Jun 2023 20:23:31 +0800
Subject: [PATCH 2/4] test: add

---
 .../__snapshots__/compileScript.spec.ts.snap   | 18 ++++++++++++++++++
 .../__tests__/compileScript.spec.ts            | 18 ++++++++++++++++++
 2 files changed, 36 insertions(+)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index 97150312eb0..591a23813b0 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -62,6 +62,24 @@ return { fn }
 })"
 `;
 
+exports[`SFC compile <script setup> > <script> and <script setup> co-usage > keep original semi style 1`] = `
+"export default {
+  props: ['item'],
+  emits: ['change'],
+  setup(__props, { expose: __expose, emit: __emit }) {
+  __expose();
+
+        console.log('test')
+        const props = __props;
+        const emit = __emit;
+        (function () {})()
+        
+return { props, emit }
+}
+
+}"
+`;
+
 exports[`SFC compile <script setup> > <script> and <script setup> co-usage > script first 1`] = `
 "import { x } from './x'
       
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index 35664290191..59454189d9b 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -161,6 +161,24 @@ describe('SFC compile <script setup>', () => {
       assertCode(content)
     })
 
+    // #7805
+    test('keep original semi style', () => {
+      const { content } = compile(`
+        <script setup>
+        console.log('test')
+        const props = defineProps(['item']);
+        const emit = defineEmits(['change']);
+        (function () {})()
+        </script>
+      `)
+      assertCode(content)
+
+      expect(content).toMatch(`console.log('test')`)
+      expect(content).toMatch(`const props = __props;`)
+      expect(content).toMatch(`const emit = __emit;`)
+      expect(content).toMatch(`(function () {})()`)
+    })
+
     test('script setup first, named default export', () => {
       const { content } = compile(`
       <script setup>

From 521cc3bd7a8f41646969a6c3e02ce7989d4fd21a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Sat, 10 Jun 2023 20:25:58 +0800
Subject: [PATCH 3/4] refactor: remove useless

---
 packages/compiler-sfc/src/script/context.ts     | 3 +--
 packages/compiler-sfc/src/script/defineEmits.ts | 1 -
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/compiler-sfc/src/script/context.ts b/packages/compiler-sfc/src/script/context.ts
index 1a5a21c8db9..5fe09d28a42 100644
--- a/packages/compiler-sfc/src/script/context.ts
+++ b/packages/compiler-sfc/src/script/context.ts
@@ -48,10 +48,9 @@ export class ScriptCompileContext {
   propsRuntimeDefaults: Node | undefined
 
   // defineEmits
-  emitsCall: CallExpression | undefined
-  emitDecl: Node | undefined
   emitsRuntimeDecl: Node | undefined
   emitsTypeDecl: Node | undefined
+  emitDecl: Node | undefined
 
   // defineModel
   modelDecls: Record<string, ModelDecl> = {}
diff --git a/packages/compiler-sfc/src/script/defineEmits.ts b/packages/compiler-sfc/src/script/defineEmits.ts
index 6eb6c10ff85..02014d1b276 100644
--- a/packages/compiler-sfc/src/script/defineEmits.ts
+++ b/packages/compiler-sfc/src/script/defineEmits.ts
@@ -29,7 +29,6 @@ export function processDefineEmits(
     ctx.emitsTypeDecl = node.typeParameters.params[0]
   }
 
-  ctx.emitsCall = node
   ctx.emitDecl = declId
 
   return true

From 67fbd0e30c84d34d96341ec526dcad7bf0fe7d68 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Sat, 10 Jun 2023 20:36:01 +0800
Subject: [PATCH 4/4] test: update

---
 .../__snapshots__/compileScript.spec.ts.snap  | 68 -------------------
 .../__tests__/compileScript.spec.ts           | 63 -----------------
 .../definePropsDestructure.spec.ts.snap       | 55 +++++++++++++++
 .../definePropsDestructure.spec.ts            | 52 ++++++++++++++
 4 files changed, 107 insertions(+), 131 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index 591a23813b0..9c9b6baa5e1 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -630,74 +630,6 @@ return { foo, bar, baz, y, z }
 }"
 `;
 
-exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable declaration (full removal) 1`] = `
-"export default {
-  props: ['item'],
-  emits: ['a'],
-  setup(__props, { expose: __expose, emit: __emit }) {
-  __expose();
-
-    const props = __props,
-          emit = __emit;
-    
-return { props, emit }
-}
-
-}"
-`;
-
-exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable declaration 1`] = `
-"export default {
-  props: ['item'],
-  emits: ['a'],
-  setup(__props, { expose: __expose, emit: __emit }) {
-  __expose();
-
-    const props = __props,
-      a = 1,
-      emit = __emit;
-    
-return { props, a, emit }
-}
-
-}"
-`;
-
-exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable declaration fix #6757  1`] = `
-"export default {
-  props: ['item'],
-  emits: ['a'],
-  setup(__props, { expose: __expose, emit: __emit }) {
-  __expose();
-
-    const a = 1,
-          props = __props,
-          emit = __emit;
-    
-return { a, props, emit }
-}
-
-}"
-`;
-
-exports[`SFC compile <script setup> > defineProps/defineEmits in multi-variable declaration fix #7422 1`] = `
-"export default {
-  props: ['item'],
-  emits: ['foo'],
-  setup(__props, { expose: __expose, emit: __emit }) {
-  __expose();
-
-    const props = __props,
-          emits = __emit,
-          a = 0,
-          b = 0;
-    
-return { props, emits, a, b }
-}
-
-}"
-`;
-
 exports[`SFC compile <script setup> > dev mode import usage check > TS annotations 1`] = `
 "import { defineComponent as _defineComponent } from 'vue'
 import { Foo, Bar, Baz, Qux, Fred } from './x'
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index 59454189d9b..290e4df9f5d 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -68,69 +68,6 @@ describe('SFC compile <script setup>', () => {
     assertCode(content)
   })
 
-  test('defineProps/defineEmits in multi-variable declaration', () => {
-    const { content } = compile(`
-    <script setup>
-    const props = defineProps(['item']),
-      a = 1,
-      emit = defineEmits(['a']);
-    </script>
-  `)
-    assertCode(content)
-    expect(content).toMatch(`const props = __props,`)
-    expect(content).toMatch(`a = 1,`)
-    expect(content).toMatch(`emit = __emit;`)
-    expect(content).toMatch(`props: ['item'],`)
-    expect(content).toMatch(`emits: ['a'],`)
-  })
-
-  // #6757
-  test('defineProps/defineEmits in multi-variable declaration fix #6757 ', () => {
-    const { content } = compile(`
-    <script setup>
-    const a = 1,
-          props = defineProps(['item']),
-          emit = defineEmits(['a']);
-    </script>
-  `)
-    assertCode(content)
-    expect(content).toMatch(`const a = 1,`)
-    expect(content).toMatch(`props = __props,`)
-    expect(content).toMatch(`emit = __emit;`)
-    expect(content).toMatch(`props: ['item'],`)
-    expect(content).toMatch(`emits: ['a'],`)
-  })
-
-  // #7422
-  test('defineProps/defineEmits in multi-variable declaration fix #7422', () => {
-    const { content } = compile(`
-    <script setup>
-    const props = defineProps(['item']),
-          emits = defineEmits(['foo']),
-          a = 0,
-          b = 0;
-    </script>
-  `)
-    assertCode(content)
-    expect(content).toMatch(`props: ['item'],`)
-    expect(content).toMatch(`emits: ['foo'],`)
-    expect(content).toMatch(`const props = __props,`)
-    expect(content).toMatch(`a = 0,`)
-    expect(content).toMatch(`b = 0;`)
-  })
-
-  test('defineProps/defineEmits in multi-variable declaration (full removal)', () => {
-    const { content } = compile(`
-    <script setup>
-    const props = defineProps(['item']),
-          emit = defineEmits(['a']);
-    </script>
-  `)
-    assertCode(content)
-    expect(content).toMatch(`props: ['item'],`)
-    expect(content).toMatch(`emits: ['a'],`)
-  })
-
   describe('<script> and <script setup> co-usage', () => {
     test('script first', () => {
       const { content } = compile(`
diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
index ce12fe49ad7..c31005c40c0 100644
--- a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap
@@ -176,6 +176,61 @@ return () => {}
 })"
 `;
 
+exports[`sfc reactive props destructure > defineProps/defineEmits in multi-variable declaration (full removal) 1`] = `
+"export default {
+  props: ['item'],
+  emits: ['a'],
+  setup(__props, { emit: __emit }) {
+
+    const props = __props,
+          emit = __emit;
+    
+return () => {}
+}
+
+}"
+`;
+
+exports[`sfc reactive props destructure > multi-variable declaration 1`] = `
+"export default {
+  props: ['item'],
+  setup(__props) {
+
+    const a = 1;
+    
+return () => {}
+}
+
+}"
+`;
+
+exports[`sfc reactive props destructure > multi-variable declaration fix #6757  1`] = `
+"export default {
+  props: ['item'],
+  setup(__props) {
+
+    const a = 1;
+    
+return () => {}
+}
+
+}"
+`;
+
+exports[`sfc reactive props destructure > multi-variable declaration fix #7422 1`] = `
+"export default {
+  props: ['item'],
+  setup(__props) {
+
+    const a = 0,
+          b = 0;
+    
+return () => {}
+}
+
+}"
+`;
+
 exports[`sfc reactive props destructure > multiple variable declarations 1`] = `
 "import { toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock } from \\"vue\\"
 
diff --git a/packages/compiler-sfc/__tests__/compileScript/definePropsDestructure.spec.ts b/packages/compiler-sfc/__tests__/compileScript/definePropsDestructure.spec.ts
index a2941872fd2..a41f3131bef 100644
--- a/packages/compiler-sfc/__tests__/compileScript/definePropsDestructure.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript/definePropsDestructure.spec.ts
@@ -282,6 +282,58 @@ describe('sfc reactive props destructure', () => {
     })
   })
 
+  test('multi-variable declaration', () => {
+    const { content } = compile(`
+    <script setup>
+    const { item } = defineProps(['item']),
+      a = 1;
+    </script>
+  `)
+    assertCode(content)
+    expect(content).toMatch(`const a = 1;`)
+    expect(content).toMatch(`props: ['item'],`)
+  })
+
+  // #6757
+  test('multi-variable declaration fix #6757 ', () => {
+    const { content } = compile(`
+    <script setup>
+    const a = 1,
+      { item } = defineProps(['item']);
+    </script>
+  `)
+    assertCode(content)
+    expect(content).toMatch(`const a = 1;`)
+    expect(content).toMatch(`props: ['item'],`)
+  })
+
+  // #7422
+  test('multi-variable declaration fix #7422', () => {
+    const { content } = compile(`
+    <script setup>
+    const { item } = defineProps(['item']),
+          a = 0,
+          b = 0;
+    </script>
+  `)
+    assertCode(content)
+    expect(content).toMatch(`const a = 0,`)
+    expect(content).toMatch(`b = 0;`)
+    expect(content).toMatch(`props: ['item'],`)
+  })
+
+  test('defineProps/defineEmits in multi-variable declaration (full removal)', () => {
+    const { content } = compile(`
+    <script setup>
+    const props = defineProps(['item']),
+          emit = defineEmits(['a']);
+    </script>
+  `)
+    assertCode(content)
+    expect(content).toMatch(`props: ['item'],`)
+    expect(content).toMatch(`emits: ['a'],`)
+  })
+
   describe('errors', () => {
     test('should error on deep destructure', () => {
       expect(() =>