From d046962ab4090aac1ba600c4b6ce67ecb3faf509 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: Tue, 17 Oct 2023 17:57:58 +0800
Subject: [PATCH 1/8] feat(compiler-sfc): introduce `defineRender`

---
 .../__snapshots__/defineRender.spec.ts.snap   | 47 +++++++++++++++++++
 .../compileScript/defineRender.spec.ts        | 46 ++++++++++++++++++
 packages/compiler-sfc/__tests__/utils.ts      |  1 +
 packages/compiler-sfc/src/compileScript.ts    | 27 +++++++++--
 packages/compiler-sfc/src/script/context.ts   |  4 ++
 .../compiler-sfc/src/script/defineRender.ts   | 34 ++++++++++++++
 6 files changed, 155 insertions(+), 4 deletions(-)
 create mode 100644 packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
 create mode 100644 packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
 create mode 100644 packages/compiler-sfc/src/script/defineRender.ts

diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
new file mode 100644
index 00000000000..8d02ab682e1
--- /dev/null
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
@@ -0,0 +1,47 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`defineRender() > JSX Element 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+
+export default /*#__PURE__*/_defineComponent({
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      
+      
+return () => <div />
+}
+
+})"
+`;
+
+exports[`defineRender() > function 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+
+export default /*#__PURE__*/_defineComponent({
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      
+      
+return () => <div />
+}
+
+})"
+`;
+
+exports[`defineRender() > identifier 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+import { renderFn } from './ctx'
+      
+export default /*#__PURE__*/_defineComponent({
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      
+      
+return renderFn
+}
+
+})"
+`;
diff --git a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
new file mode 100644
index 00000000000..53f3cb3e116
--- /dev/null
+++ b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
@@ -0,0 +1,46 @@
+import { compileSFCScript as compile, assertCode } from '../utils'
+
+describe('defineRender()', () => {
+  test('JSX Element', () => {
+    const { content } = compile(
+      `
+      <script setup lang="tsx">
+      defineRender(<div />)
+      </script>
+    `,
+      { defineRender: true }
+    )
+    assertCode(content)
+    expect(content).toMatch(`return () => <div />`)
+    expect(content).not.toMatch('defineRender')
+  })
+
+  test('function', () => {
+    const { content } = compile(
+      `
+      <script setup lang="tsx">
+      defineRender(() => <div />)
+      </script>
+    `,
+      { defineRender: true }
+    )
+    assertCode(content)
+    expect(content).toMatch(`return () => <div />`)
+    expect(content).not.toMatch('defineRender')
+  })
+
+  test('identifier', () => {
+    const { content } = compile(
+      `
+      <script setup lang="ts">
+      import { renderFn } from './ctx'
+      defineRender(renderFn)
+      </script>
+    `,
+      { defineRender: true }
+    )
+    assertCode(content)
+    expect(content).toMatch(`return renderFn`)
+    expect(content).not.toMatch('defineRender')
+  })
+})
diff --git a/packages/compiler-sfc/__tests__/utils.ts b/packages/compiler-sfc/__tests__/utils.ts
index 5498ede2717..30db906a4ec 100644
--- a/packages/compiler-sfc/__tests__/utils.ts
+++ b/packages/compiler-sfc/__tests__/utils.ts
@@ -31,6 +31,7 @@ export function assertCode(code: string) {
       plugins: [
         'typescript',
         ['importAttributes', { deprecatedAssertSyntax: true }],
+        'jsx',
       ],
     })
   } catch (e: any) {
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 46fc65c0069..851d794f11f 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -55,6 +55,7 @@ import { getImportedName, isCallOf, isLiteralNode } from './script/utils'
 import { analyzeScriptBindings } from './script/analyzeScriptBindings'
 import { isImportUsed } from './script/importUsageCheck'
 import { processAwait } from './script/topLevelAwait'
+import { DEFINE_RENDER, processDefineRender } from './script/defineRender'
 
 export interface SFCScriptCompileOptions {
   /**
@@ -105,6 +106,11 @@ export interface SFCScriptCompileOptions {
    * @default true
    */
   hoistStatic?: boolean
+  /**
+   * (**Experimental**) Enable macro `defineRender`
+   * @default false
+   */
+  defineRender?: boolean
   /**
    * (**Experimental**) Enable reactive destructure for `defineProps`
    * @default false
@@ -491,7 +497,8 @@ export function compileScript(
         processDefineProps(ctx, expr) ||
         processDefineEmits(ctx, expr) ||
         processDefineOptions(ctx, expr) ||
-        processDefineSlots(ctx, expr)
+        processDefineSlots(ctx, expr) ||
+        processDefineRender(ctx, expr)
       ) {
         ctx.s.remove(node.start! + startOffset, node.end! + startOffset)
       } else if (processDefineExpose(ctx, expr)) {
@@ -529,7 +536,8 @@ export function compileScript(
             !isDefineProps && processDefineEmits(ctx, init, decl.id)
           !isDefineEmits &&
             (processDefineSlots(ctx, init, decl.id) ||
-              processDefineModel(ctx, init, decl.id))
+              processDefineModel(ctx, init, decl.id) ||
+              processDefineRender(ctx, init))
 
           if (
             isDefineProps &&
@@ -797,8 +805,19 @@ export function compileScript(
   }
 
   // 9. generate return statement
-  let returned
-  if (
+  let returned = ''
+  if (ctx.renderFunction) {
+    if (sfc.template) {
+      warnOnce(`<template> is ignored when using ${DEFINE_RENDER}().`)
+    }
+    if (ctx.renderFunction.type === 'JSXElement') {
+      returned = '() => '
+    }
+    returned += scriptSetup.content.slice(
+      ctx.renderFunction.start!,
+      ctx.renderFunction.end!
+    )
+  } else if (
     !options.inlineTemplate ||
     (!sfc.template && ctx.hasDefaultExportRender)
   ) {
diff --git a/packages/compiler-sfc/src/script/context.ts b/packages/compiler-sfc/src/script/context.ts
index f74adee603b..f573645ca9c 100644
--- a/packages/compiler-sfc/src/script/context.ts
+++ b/packages/compiler-sfc/src/script/context.ts
@@ -36,6 +36,7 @@ export class ScriptCompileContext {
   hasDefaultExportRender = false
   hasDefineOptionsCall = false
   hasDefineSlotsCall = false
+  hasDefineRenderCall = false
   hasDefineModelCall = false
 
   // defineProps
@@ -59,6 +60,9 @@ export class ScriptCompileContext {
   // defineOptions
   optionsRuntimeDecl: Node | undefined
 
+  // defineRender
+  renderFunction?: Node
+
   // codegen
   bindingMetadata: BindingMetadata = {}
   helperImports: Set<string> = new Set()
diff --git a/packages/compiler-sfc/src/script/defineRender.ts b/packages/compiler-sfc/src/script/defineRender.ts
new file mode 100644
index 00000000000..b4c7e90b6f4
--- /dev/null
+++ b/packages/compiler-sfc/src/script/defineRender.ts
@@ -0,0 +1,34 @@
+import { Node } from '@babel/types'
+import { isCallOf } from './utils'
+import { ScriptCompileContext } from './context'
+import { warnOnce } from '../warn'
+
+export const DEFINE_RENDER = 'defineRender'
+
+export function processDefineRender(
+  ctx: ScriptCompileContext,
+  node: Node
+): boolean {
+  if (!isCallOf(node, DEFINE_RENDER)) {
+    return false
+  }
+
+  if (!ctx.options.defineRender) {
+    warnOnce(
+      `${DEFINE_RENDER}() is an experimental feature and disabled by default.\n` +
+        `To enable it, follow the RFC at https://github.com/vuejs/rfcs/discussions/TODO.`
+    )
+    return false
+  }
+
+  if (ctx.hasDefineRenderCall) {
+    ctx.error(`duplicate ${DEFINE_RENDER}() call`, node)
+  }
+
+  ctx.hasDefineRenderCall = true
+  if (node.arguments.length > 0) {
+    ctx.renderFunction = node.arguments[0]
+  }
+
+  return true
+}

From 3ba54c904228297b1e8b37bae588a52bfe03193f 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: Tue, 17 Oct 2023 20:29:32 +0800
Subject: [PATCH 2/8] refactor: unwrap if...else

---
 packages/compiler-sfc/src/compileScript.ts | 105 ++++++++++-----------
 1 file changed, 49 insertions(+), 56 deletions(-)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 851d794f11f..f315bfc6c65 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -856,66 +856,59 @@ export function compileScript(
       }
     }
     returned = returned.replace(/, $/, '') + ` }`
-  } else {
+  } else if (sfc.template && !sfc.template.src) {
     // inline mode
-    if (sfc.template && !sfc.template.src) {
-      if (options.templateOptions && options.templateOptions.ssr) {
-        hasInlinedSsrRenderFn = true
-      }
-      // inline render function mode - we are going to compile the template and
-      // inline it right here
-      const { code, ast, preamble, tips, errors } = compileTemplate({
-        filename,
+    if (options.templateOptions && options.templateOptions.ssr) {
+      hasInlinedSsrRenderFn = true
+    }
+    // inline render function mode - we are going to compile the template and
+    // inline it right here
+    const { code, ast, preamble, tips, errors } = compileTemplate({
+      filename,
         ast: sfc.template.ast,
-        source: sfc.template.content,
-        inMap: sfc.template.map,
-        ...options.templateOptions,
-        id: scopeId,
-        scoped: sfc.styles.some(s => s.scoped),
-        isProd: options.isProd,
-        ssrCssVars: sfc.cssVars,
-        compilerOptions: {
-          ...(options.templateOptions &&
-            options.templateOptions.compilerOptions),
-          inline: true,
-          isTS: ctx.isTS,
-          bindingMetadata: ctx.bindingMetadata,
-        },
-      })
-      if (tips.length) {
-        tips.forEach(warnOnce)
-      }
-      const err = errors[0]
-      if (typeof err === 'string') {
-        throw new Error(err)
-      } else if (err) {
-        if (err.loc) {
-          err.message +=
-            `\n\n` +
-            sfc.filename +
-            '\n' +
-            generateCodeFrame(
-              source,
-              err.loc.start.offset,
-              err.loc.end.offset,
-            ) +
-            `\n`
-        }
-        throw err
-      }
-      if (preamble) {
-        ctx.s.prepend(preamble)
-      }
-      // avoid duplicated unref import
-      // as this may get injected by the render function preamble OR the
-      // css vars codegen
-      if (ast && ast.helpers.has(UNREF)) {
-        ctx.helperImports.delete('unref')
+      source: sfc.template.content,
+      inMap: sfc.template.map,
+      ...options.templateOptions,
+      id: scopeId,
+      scoped: sfc.styles.some(s => s.scoped),
+      isProd: options.isProd,
+      ssrCssVars: sfc.cssVars,
+      compilerOptions: {
+        ...(options.templateOptions && options.templateOptions.compilerOptions),
+        inline: true,
+        isTS: ctx.isTS,
+        bindingMetadata: ctx.bindingMetadata,
+      },
+    })
+    if (tips.length) {
+      tips.forEach(warnOnce)
+    }
+    const err = errors[0]
+    if (typeof err === 'string') {
+      throw new Error(err)
+    } else if (err) {
+      if (err.loc) {
+        err.message +=
+          `\n\n` +
+          sfc.filename +
+          '\n' +
+          generateCodeFrame(source, err.loc.start.offset, err.loc.end.offset,) +
+          `\n`
       }
-      returned = code
-    } else {
-      returned = `() => {}`
+      throw err
     }
+    if (preamble) {
+      ctx.s.prepend(preamble)
+    }
+    // avoid duplicated unref import
+    // as this may get injected by the render function preamble OR the
+    // css vars codegen
+    if (ast && ast.helpers.has(UNREF)) {
+      ctx.helperImports.delete('unref')
+    }
+    returned = code
+  } else {
+    returned = `() => {}`
   }
 
   if (!options.inlineTemplate && !__TEST__) {

From cee3fd329154115d2bfd5010bda83b705bdb6b7a 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: Wed, 18 Oct 2023 15:30:05 +0800
Subject: [PATCH 3/8] refactor: throw an error using with <template>

---
 .../compileScript/defineRender.spec.ts         | 18 ++++++++++++++++++
 packages/compiler-sfc/src/compileScript.ts     |  5 ++++-
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
index 53f3cb3e116..6f6ad1765d5 100644
--- a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
@@ -43,4 +43,22 @@ describe('defineRender()', () => {
     expect(content).toMatch(`return renderFn`)
     expect(content).not.toMatch('defineRender')
   })
+
+  describe('errors', () => {
+    test('w/ <template>', () => {
+      expect(() =>
+        compile(
+          `
+      <script setup lang="tsx">
+      defineRender(<div />)
+      </script>
+      <template>
+        <span>hello</span>
+      </template>
+    `,
+          { defineRender: true }
+        )
+      ).toThrow(`defineRender() cannot be used with <template>.`)
+    })
+  })
 })
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index f315bfc6c65..7060ed38fd1 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -808,7 +808,10 @@ export function compileScript(
   let returned = ''
   if (ctx.renderFunction) {
     if (sfc.template) {
-      warnOnce(`<template> is ignored when using ${DEFINE_RENDER}().`)
+      ctx.error(
+        `${DEFINE_RENDER}() cannot be used with <template>.`,
+        ctx.renderFunction
+      )
     }
     if (ctx.renderFunction.type === 'JSXElement') {
       returned = '() => '

From 6862bd41159e4fed12dc1f5f49764c20047545d6 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: Wed, 18 Oct 2023 15:42:18 +0800
Subject: [PATCH 4/8] test: add empty arg

---
 .../__snapshots__/defineRender.spec.ts.snap       | 15 +++++++++++++++
 .../__tests__/compileScript/defineRender.spec.ts  | 15 +++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
index 8d02ab682e1..e2914e7add0 100644
--- a/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineRender.spec.ts.snap
@@ -15,6 +15,21 @@ return () => <div />
 })"
 `;
 
+exports[`defineRender() > empty argument 1`] = `
+"const foo = 'bar'
+      
+export default {
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      
+      
+return { foo }
+}
+
+}"
+`;
+
 exports[`defineRender() > function 1`] = `
 "import { defineComponent as _defineComponent } from 'vue'
 
diff --git a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
index 6f6ad1765d5..b8a9fbe86b7 100644
--- a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
@@ -44,6 +44,21 @@ describe('defineRender()', () => {
     expect(content).not.toMatch('defineRender')
   })
 
+  test('empty argument', () => {
+    const { content } = compile(
+      `
+      <script setup>
+      const foo = 'bar'
+      defineRender()
+      </script>
+    `,
+      { defineRender: true }
+    )
+    assertCode(content)
+    expect(content).toMatch(`return { foo }`)
+    expect(content).not.toMatch('defineRender')
+  })
+
   describe('errors', () => {
     test('w/ <template>', () => {
       expect(() =>

From 03139fc550fa0442c15428e04933eb47f4fbe3b6 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: Thu, 19 Oct 2023 13:12:10 +0800
Subject: [PATCH 5/8] chore: update rfc link

---
 packages/compiler-sfc/src/script/defineRender.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/compiler-sfc/src/script/defineRender.ts b/packages/compiler-sfc/src/script/defineRender.ts
index b4c7e90b6f4..d16cd9ece5d 100644
--- a/packages/compiler-sfc/src/script/defineRender.ts
+++ b/packages/compiler-sfc/src/script/defineRender.ts
@@ -16,7 +16,7 @@ export function processDefineRender(
   if (!ctx.options.defineRender) {
     warnOnce(
       `${DEFINE_RENDER}() is an experimental feature and disabled by default.\n` +
-        `To enable it, follow the RFC at https://github.com/vuejs/rfcs/discussions/TODO.`
+        `To enable it, follow the RFC at https://github.com/vuejs/rfcs/discussions/585.`
     )
     return false
   }

From 2f82c430149db4bffcc92f819efde9798b43cad9 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: Thu, 19 Oct 2023 15:37:35 +0800
Subject: [PATCH 6/8] feat: export defineRender runtime function

---
 packages/runtime-core/src/apiSetupHelpers.ts | 23 ++++++++++++++++++++
 packages/runtime-core/src/index.ts           |  1 +
 2 files changed, 24 insertions(+)

diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index e5f79444da0..d2f9824c673 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -20,6 +20,7 @@ import type {
   ComponentOptionsWithoutProps,
   ComputedOptions,
   MethodOptions,
+  RenderFunction,
 } from './componentOptions'
 import type {
   ComponentObjectPropsOptions,
@@ -313,6 +314,28 @@ type PropsWithDefaults<
     : boolean
 }
 
+/**
+ * (**Experimental**) Vue `<script setup>` compiler macro for declaring
+ * the render function.
+ *
+ * The first argument can be a JSX element or a render function.
+ *
+ * @example
+ * ```ts
+ * // JSX element
+ * defineRender(<div>hello</div>)
+ *
+ * // Render function
+ * defineRender(() => <div>hello</div>)
+ * defineRender(() => h('div', 'hello'))
+ * ```
+ */
+export function defineRender(renderFn: JSX.Element | RenderFunction): void {
+  if (__DEV__) {
+    warnRuntimeUsage('defineRender')
+  }
+}
+
 /**
  * Vue `<script setup>` compiler macro for providing props default values when
  * using type-based `defineProps` declaration.
diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 7fbe58446f7..830b1f4e775 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -73,6 +73,7 @@ export {
   defineOptions,
   defineSlots,
   defineModel,
+  defineRender,
   withDefaults,
   type DefineProps,
   type ModelRef,

From 59dcb2b9842d631580ef46f950185cda69907f66 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: Thu, 19 Oct 2023 15:48:49 +0800
Subject: [PATCH 7/8] fix: types

---
 packages/runtime-core/src/apiSetupHelpers.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index d2f9824c673..16ffed3130d 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -31,6 +31,7 @@ import type {
 import { warn } from './warning'
 import type { SlotsType, StrictUnwrapSlotsType } from './componentSlots'
 import type { Ref } from '@vue/reactivity'
+import type { VNode } from './vnode'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -330,7 +331,7 @@ type PropsWithDefaults<
  * defineRender(() => h('div', 'hello'))
  * ```
  */
-export function defineRender(renderFn: JSX.Element | RenderFunction): void {
+export function defineRender(renderFn: VNode | RenderFunction): void {
   if (__DEV__) {
     warnRuntimeUsage('defineRender')
   }

From e4c1b2336bf5974c268b6a8bf5a0f73fed879c9a Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Sat, 20 Jan 2024 16:04:42 +0000
Subject: [PATCH 8/8] [autofix.ci] apply automated fixes

---
 .../__tests__/compileScript/defineRender.spec.ts   | 14 +++++++-------
 packages/compiler-sfc/src/compileScript.ts         |  8 ++++----
 packages/compiler-sfc/src/script/defineRender.ts   |  8 ++++----
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
index b8a9fbe86b7..d33eb551ca2 100644
--- a/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript/defineRender.spec.ts
@@ -1,4 +1,4 @@
-import { compileSFCScript as compile, assertCode } from '../utils'
+import { assertCode, compileSFCScript as compile } from '../utils'
 
 describe('defineRender()', () => {
   test('JSX Element', () => {
@@ -8,7 +8,7 @@ describe('defineRender()', () => {
       defineRender(<div />)
       </script>
     `,
-      { defineRender: true }
+      { defineRender: true },
     )
     assertCode(content)
     expect(content).toMatch(`return () => <div />`)
@@ -22,7 +22,7 @@ describe('defineRender()', () => {
       defineRender(() => <div />)
       </script>
     `,
-      { defineRender: true }
+      { defineRender: true },
     )
     assertCode(content)
     expect(content).toMatch(`return () => <div />`)
@@ -37,7 +37,7 @@ describe('defineRender()', () => {
       defineRender(renderFn)
       </script>
     `,
-      { defineRender: true }
+      { defineRender: true },
     )
     assertCode(content)
     expect(content).toMatch(`return renderFn`)
@@ -52,7 +52,7 @@ describe('defineRender()', () => {
       defineRender()
       </script>
     `,
-      { defineRender: true }
+      { defineRender: true },
     )
     assertCode(content)
     expect(content).toMatch(`return { foo }`)
@@ -71,8 +71,8 @@ describe('defineRender()', () => {
         <span>hello</span>
       </template>
     `,
-          { defineRender: true }
-        )
+          { defineRender: true },
+        ),
       ).toThrow(`defineRender() cannot be used with <template>.`)
     })
   })
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 7060ed38fd1..ccc33432654 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -810,7 +810,7 @@ export function compileScript(
     if (sfc.template) {
       ctx.error(
         `${DEFINE_RENDER}() cannot be used with <template>.`,
-        ctx.renderFunction
+        ctx.renderFunction,
       )
     }
     if (ctx.renderFunction.type === 'JSXElement') {
@@ -818,7 +818,7 @@ export function compileScript(
     }
     returned += scriptSetup.content.slice(
       ctx.renderFunction.start!,
-      ctx.renderFunction.end!
+      ctx.renderFunction.end!,
     )
   } else if (
     !options.inlineTemplate ||
@@ -868,7 +868,7 @@ export function compileScript(
     // inline it right here
     const { code, ast, preamble, tips, errors } = compileTemplate({
       filename,
-        ast: sfc.template.ast,
+      ast: sfc.template.ast,
       source: sfc.template.content,
       inMap: sfc.template.map,
       ...options.templateOptions,
@@ -895,7 +895,7 @@ export function compileScript(
           `\n\n` +
           sfc.filename +
           '\n' +
-          generateCodeFrame(source, err.loc.start.offset, err.loc.end.offset,) +
+          generateCodeFrame(source, err.loc.start.offset, err.loc.end.offset) +
           `\n`
       }
       throw err
diff --git a/packages/compiler-sfc/src/script/defineRender.ts b/packages/compiler-sfc/src/script/defineRender.ts
index d16cd9ece5d..674c25a702e 100644
--- a/packages/compiler-sfc/src/script/defineRender.ts
+++ b/packages/compiler-sfc/src/script/defineRender.ts
@@ -1,13 +1,13 @@
-import { Node } from '@babel/types'
+import type { Node } from '@babel/types'
 import { isCallOf } from './utils'
-import { ScriptCompileContext } from './context'
+import type { ScriptCompileContext } from './context'
 import { warnOnce } from '../warn'
 
 export const DEFINE_RENDER = 'defineRender'
 
 export function processDefineRender(
   ctx: ScriptCompileContext,
-  node: Node
+  node: Node,
 ): boolean {
   if (!isCallOf(node, DEFINE_RENDER)) {
     return false
@@ -16,7 +16,7 @@ export function processDefineRender(
   if (!ctx.options.defineRender) {
     warnOnce(
       `${DEFINE_RENDER}() is an experimental feature and disabled by default.\n` +
-        `To enable it, follow the RFC at https://github.com/vuejs/rfcs/discussions/585.`
+        `To enable it, follow the RFC at https://github.com/vuejs/rfcs/discussions/585.`,
     )
     return false
   }