diff --git a/packages/compiler-sfc/__tests__/compileTemplate.spec.ts b/packages/compiler-sfc/__tests__/compileTemplate.spec.ts index 74ecea62830..16edf21e43c 100644 --- a/packages/compiler-sfc/__tests__/compileTemplate.spec.ts +++ b/packages/compiler-sfc/__tests__/compileTemplate.spec.ts @@ -542,6 +542,19 @@ test('returns multiRoot metadata for a multi-root template when vapor is enabled expect(result.multiRoot).toBe(true) }) +test('template-only vapor compile keeps built-in render args for $slots', () => { + const result = compile({ + filename: 'example.vue', + source: ``, + vapor: true, + }) + + expect(result.code).toContain( + `export function render(_ctx, $props, $emit, $attrs, $slots)`, + ) + expect(result.code).toContain(`_createIf(() => ($slots.default)`) +}) + test('returns single-root metadata for root control flow when vapor is enabled', () => { const result = compile({ filename: 'example.vue', diff --git a/packages/compiler-sfc/src/compileTemplate.ts b/packages/compiler-sfc/src/compileTemplate.ts index eb0a9a20750..b4e75e9a435 100644 --- a/packages/compiler-sfc/src/compileTemplate.ts +++ b/packages/compiler-sfc/src/compileTemplate.ts @@ -255,6 +255,12 @@ function doCompileTemplate({ slotted, sourceMap: true, ...compilerOptions, + // Template-only vapor SFCs have no script analysis, but compiler-vapor + // still needs bindingMetadata to keep built-in render args like $slots. + bindingMetadata: + vapor && !ssr && compilerOptions.bindingMetadata == null + ? {} + : compilerOptions.bindingMetadata, hmr: !isProd, nodeTransforms: nodeTransforms.concat( compilerOptions.nodeTransforms || [], diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformAssetUrl.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformAssetUrl.spec.ts.snap index 766937617f2..0e274d69fc0 100644 --- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformAssetUrl.spec.ts.snap +++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformAssetUrl.spec.ts.snap @@ -4,7 +4,7 @@ exports[`compiler sfc: transform asset url > should allow for full base URLs, wi "import { template as _template } from 'vue'; const t0 = _template("", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -14,7 +14,7 @@ exports[`compiler sfc: transform asset url > should allow for full base URLs, wi "import { template as _template } from 'vue'; const t0 = _template("", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -24,7 +24,7 @@ exports[`compiler sfc: transform asset url > should allow for full base URLs, wi "import { template as _template } from 'vue'; const t0 = _template("", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -34,7 +34,7 @@ exports[`compiler sfc: transform asset url > should allow for full base URLs, wi "import { template as _template } from 'vue'; const t0 = _template("", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -45,7 +45,7 @@ exports[`compiler sfc: transform asset url > support uri fragment 1`] = ` import _imports_0 from '@svg/file.svg'; const t0 = _template("", false, 1) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t0() return [n0, n1] @@ -56,7 +56,7 @@ exports[`compiler sfc: transform asset url > support uri is empty 1`] = ` "import { template as _template } from 'vue'; const t0 = _template("", true, 1) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -74,7 +74,7 @@ const t3 = _template("") const t4 = _template("") const t5 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t1() @@ -92,7 +92,7 @@ import _imports_0 from './bar.png'; import _imports_1 from '/bar.png'; const t0 = _template("
", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }" @@ -106,7 +106,7 @@ const t0 = _template("") const t1 = _template("") const t2 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t1() @@ -124,7 +124,7 @@ const t1 = _template("") const t2 = _template("") const t3 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t2() diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformSrcset.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformSrcset.spec.ts.snap index d87283d30ec..29c2c89b252 100644 --- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformSrcset.spec.ts.snap +++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/templateTransformSrcset.spec.ts.snap @@ -7,7 +7,7 @@ import _imports_1 from '/foo/logo.png'; const t0 = _template("") const t1 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() return [n0, n1] @@ -30,7 +30,7 @@ const t8 = _template("") const t10 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t2() @@ -63,7 +63,7 @@ const t8 = _template("") const t10 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t2() @@ -96,7 +96,7 @@ const t8 = _template("") const t10 = _template("") -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() const n1 = t1() const n2 = t2() @@ -119,7 +119,7 @@ import _imports_0 from './logo.png'; import _imports_1 from '/logo.png'; const t0 = _template("
", true) -export function render(_ctx) { +export function render(_ctx, $props, $emit, $attrs, $slots) { const n0 = t0() return n0 }"