diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
index 05e3a5f51..b596e7977 100644
--- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`compile > bindings 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, insert as _insert, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _template("
count is .
")
+
export function render(_ctx) {
- const t0 = _template("count is .
")
const n0 = t0()
const { 0: [n3, { 1: [n2],}],} = _children(n0)
const n1 = _createTextNode()
@@ -19,8 +20,9 @@ export function render(_ctx) {
exports[`compile > custom directive > basic 1`] = `
"import { template as _template, children as _children, resolveDirective as _resolveDirective, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_resolveDirective("vTest")], [_resolveDirective("vHello"), void 0, void 0, { world: true }]])
@@ -31,8 +33,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > basic 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample]])
@@ -43,8 +46,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > binding value 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, () => _ctx.msg]])
@@ -55,8 +59,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > dynamic parameters 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, () => _ctx.msg, _ctx.foo]])
@@ -67,8 +72,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > modifiers 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, () => _ctx.msg, void 0, { bar: true }]])
@@ -79,8 +85,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > modifiers w/o binding 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, void 0, void 0, { "foo-bar": true }]])
@@ -91,8 +98,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > static parameters 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, () => _ctx.msg, "foo"]])
@@ -103,8 +111,9 @@ export function render(_ctx) {
exports[`compile > directives > custom directive > static parameters and modifiers 1`] = `
"import { template as _template, children as _children, withDirectives as _withDirectives } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_withDirectives(n1, [[_ctx.vExample, () => _ctx.msg, "foo", { bar: true }]])
@@ -115,8 +124,9 @@ export function render(_ctx) {
exports[`compile > directives > v-cloak > basic 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("test
")
+
export function render(_ctx) {
- const t0 = _template("test
")
const n0 = t0()
return n0
}"
@@ -125,8 +135,9 @@ export function render(_ctx) {
exports[`compile > directives > v-pre > basic 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template(" {{ bar }}
")
+
export function render(_ctx) {
- const t0 = _template(" {{ bar }}
")
const n0 = t0()
return n0
}"
@@ -135,8 +146,9 @@ export function render(_ctx) {
exports[`compile > directives > v-pre > self-closing v-pre 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, append as _append, renderEffect as _renderEffect, setText as _setText, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 1: [n2],} = _children(n0)
const n1 = _createTextNode()
@@ -154,8 +166,9 @@ export function render(_ctx) {
exports[`compile > directives > v-pre > should not affect siblings after it 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, append as _append, renderEffect as _renderEffect, setText as _setText, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template(" {{ bar }}
")
+
export function render(_ctx) {
- const t0 = _template(" {{ bar }}
")
const n0 = t0()
const { 1: [n2],} = _children(n0)
const n1 = _createTextNode()
@@ -173,8 +186,9 @@ export function render(_ctx) {
exports[`compile > dynamic root 1`] = `
"import { fragment as _fragment, createTextNode as _createTextNode, append as _append, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _fragment()
+
export function render(_ctx) {
- const t0 = _fragment()
const n0 = t0()
const n1 = _createTextNode()
const n2 = _createTextNode()
@@ -192,8 +206,9 @@ export function render(_ctx) {
exports[`compile > dynamic root nodes and interpolation 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, prepend as _prepend, insert as _insert, append as _append, on as _on, renderEffect as _renderEffect, setText as _setText, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("foofoo ")
+
export function render(_ctx) {
- const t0 = _template("foofoo ")
const n0 = t0()
const { 0: [n4, { 1: [n5],}],} = _children(n0)
const n1 = _createTextNode()
@@ -214,8 +229,9 @@ export function render(_ctx) {
`;
exports[`compile > expression parsing > interpolation 1`] = `
-"(() => {
- const t0 = _fragment()
+"
+const t0 = _fragment()
+(() => {
const n0 = t0()
const n1 = _createTextNode()
_append(n0, n1)
@@ -227,8 +243,9 @@ exports[`compile > expression parsing > interpolation 1`] = `
`;
exports[`compile > expression parsing > v-bind 1`] = `
-"(() => {
- const t0 = _template("
")
+"
+const t0 = _template("
")
+(() => {
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -241,8 +258,9 @@ exports[`compile > expression parsing > v-bind 1`] = `
exports[`compile > fragment 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
return n0
}"
@@ -251,8 +269,9 @@ export function render(_ctx) {
exports[`compile > static + dynamic root 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, prepend as _prepend, insert as _insert, append as _append, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _template("369")
+
export function render(_ctx) {
- const t0 = _template("369")
const n0 = t0()
const { 1: [n9], 3: [n10],} = _children(n0)
const n1 = _createTextNode()
@@ -298,8 +317,9 @@ export function render(_ctx) {
exports[`compile > static template 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("")
+
export function render(_ctx) {
- const t0 = _template("")
const n0 = t0()
return n0
}"
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
index 9471b2276..438f16c3d 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`compiler: element transform > props merging: class 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setClass as _setClass } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -17,8 +18,9 @@ export function render(_ctx) {
exports[`compiler: element transform > props merging: style 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setStyle as _setStyle } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -31,8 +33,9 @@ export function render(_ctx) {
exports[`compiler: element transform > static props 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
return n0
}"
@@ -41,8 +44,9 @@ export function render(_ctx) {
exports[`compiler: element transform > v-bind="obj" 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -55,8 +59,9 @@ export function render(_ctx) {
exports[`compiler: element transform > v-bind="obj" after static prop 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -69,8 +74,9 @@ export function render(_ctx) {
exports[`compiler: element transform > v-bind="obj" before static prop 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -83,8 +89,9 @@ export function render(_ctx) {
exports[`compiler: element transform > v-bind="obj" between static props 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
index 42d74496b..f644adba2 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`compiler v-bind > .attr modifier 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setAttr as _setAttr } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -17,8 +18,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .attr modifier w/ no expression 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setAttr as _setAttr } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -31,8 +33,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .camel modifier 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -46,8 +49,9 @@ exports[`compiler v-bind > .camel modifier w/ dynamic arg 1`] = `
"import { camelize as _camelize } from 'vue';
import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -60,8 +64,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .camel modifier w/ no expression 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -74,8 +79,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .prop modifier (shortband) w/ no expression 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDOMProp as _setDOMProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -88,8 +94,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .prop modifier (shorthand) 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDOMProp as _setDOMProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -102,8 +109,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .prop modifier 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDOMProp as _setDOMProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -116,8 +124,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .prop modifier w/ dynamic arg 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -130,8 +139,9 @@ export function render(_ctx) {
exports[`compiler v-bind > .prop modifier w/ no expression 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDOMProp as _setDOMProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -144,8 +154,9 @@ export function render(_ctx) {
exports[`compiler v-bind > basic 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -158,8 +169,9 @@ export function render(_ctx) {
exports[`compiler v-bind > dynamic arg 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -172,8 +184,9 @@ export function render(_ctx) {
exports[`compiler v-bind > dynamic arg w/ static attribute 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -186,8 +199,9 @@ export function render(_ctx) {
exports[`compiler v-bind > no expression (shorthand) 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -200,8 +214,9 @@ export function render(_ctx) {
exports[`compiler v-bind > no expression 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -214,8 +229,9 @@ export function render(_ctx) {
exports[`compiler v-bind > should error if empty expression 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
return n0
}"
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap
index f0eea1022..0ea33a106 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap
@@ -3,9 +3,10 @@
exports[`compiler: v-for > basic v-for 1`] = `
"import { template as _template, fragment as _fragment, children as _children, on as _on, renderEffect as _renderEffect, setText as _setText, createFor as _createFor, append as _append } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createFor(() => (_ctx.items), (_block) => {
const n2 = t0()
@@ -25,9 +26,10 @@ export function render(_ctx) {
exports[`compiler: v-for > multi effect 1`] = `
"import { template as _template, fragment as _fragment, children as _children, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, createFor as _createFor, append as _append } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createFor(() => (_ctx.items), (_block) => {
const n2 = t0()
@@ -50,9 +52,10 @@ export function render(_ctx) {
exports[`compiler: v-for > w/o value 1`] = `
"import { template as _template, fragment as _fragment, createFor as _createFor, append as _append } from 'vue/vapor';
+const t0 = _template("item
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("item
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createFor(() => (_ctx.items), (_block) => {
const n2 = t0()
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
index ce999b4d5..c8c66f977 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`v-html > should convert v-html to innerHTML 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setHtml as _setHtml } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -17,8 +18,9 @@ export function render(_ctx) {
exports[`v-html > should raise error and ignore children when v-html is present 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setHtml as _setHtml } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -31,8 +33,9 @@ export function render(_ctx) {
exports[`v-html > should raise error if has no expression 1`] = `
"import { template as _template, children as _children, setHtml as _setHtml } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_setHtml(n1, "")
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
index 791e2c085..6b145203e 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -3,9 +3,10 @@
exports[`compiler: v-if > basic v-if 1`] = `
"import { template as _template, fragment as _fragment, children as _children, renderEffect as _renderEffect, setText as _setText, createIf as _createIf, append as _append } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
@@ -23,11 +24,12 @@ export function render(_ctx) {
exports[`compiler: v-if > comment between branches 1`] = `
"import { template as _template, children as _children, createIf as _createIf, prepend as _prepend, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _template("
")
+const t2 = _template("fine")
+const t3 = _template(" ")
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _template("
")
- const t2 = _template("fine")
- const t3 = _template(" ")
const n0 = t3()
const { 0: [n5],} = _children(n0)
const n1 = _createIf(() => (_ctx.ok), () => {
@@ -51,9 +53,10 @@ export function render(_ctx) {
exports[`compiler: v-if > dedupe same template 1`] = `
"import { template as _template, fragment as _fragment, createIf as _createIf, append as _append } from 'vue/vapor';
+const t0 = _template("hello
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("hello
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
@@ -71,9 +74,10 @@ export function render(_ctx) {
exports[`compiler: v-if > template v-if 1`] = `
"import { template as _template, fragment as _fragment, children as _children, renderEffect as _renderEffect, setText as _setText, createIf as _createIf, append as _append } from 'vue/vapor';
+const t0 = _template("
hello
")
+const t1 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
hello
")
- const t1 = _fragment()
const n0 = t1()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
@@ -91,10 +95,11 @@ export function render(_ctx) {
exports[`compiler: v-if > v-if + v-else 1`] = `
"import { template as _template, fragment as _fragment, createIf as _createIf, prepend as _prepend } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _template("
")
+const t2 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _template("
")
- const t2 = _fragment()
const n0 = t2()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
@@ -111,11 +116,12 @@ export function render(_ctx) {
exports[`compiler: v-if > v-if + v-else-if + v-else 1`] = `
"import { template as _template, fragment as _fragment, createIf as _createIf, prepend as _prepend } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _template("
")
+const t2 = _template("fine")
+const t3 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _template("
")
- const t2 = _template("fine")
- const t3 = _fragment()
const n0 = t3()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
@@ -135,10 +141,11 @@ export function render(_ctx) {
exports[`compiler: v-if > v-if + v-else-if 1`] = `
"import { template as _template, fragment as _fragment, createIf as _createIf, prepend as _prepend } from 'vue/vapor';
+const t0 = _template("
")
+const t1 = _template("
")
+const t2 = _fragment()
+
export function render(_ctx) {
- const t0 = _template("
")
- const t1 = _template("
")
- const t2 = _fragment()
const n0 = t2()
const n1 = _createIf(() => (_ctx.ok), () => {
const n2 = t0()
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap
index a14558772..9ee4e0933 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`v-on > case conversion for kebab-case events 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "fooBar", (...args) => (_ctx.onMount && _ctx.onMount(...args)))
@@ -15,8 +16,9 @@ export function render(_ctx) {
exports[`v-on > complex member expression w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", (...args) => (_ctx.a['b' + _ctx.c] && _ctx.a['b' + _ctx.c](...args)))
@@ -27,8 +29,9 @@ export function render(_ctx) {
exports[`v-on > dynamic arg 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -41,8 +44,9 @@ export function render(_ctx) {
exports[`v-on > dynamic arg with complex exp prefixing 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -55,8 +59,9 @@ export function render(_ctx) {
exports[`v-on > dynamic arg with prefixing 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -69,8 +74,9 @@ export function render(_ctx) {
exports[`v-on > event modifier 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on, withKeys as _withKeys } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1], 1: [n2], 2: [n3], 3: [n4], 4: [n5], 5: [n6], 6: [n7], 7: [n8], 8: [n9], 9: [n10], 10: [n11], 11: [n12], 12: [n13], 13: [n14], 14: [n15], 15: [n16], 16: [n17], 17: [n18], 18: [n19], 19: [n20], 20: [n21], 21: [n22],} = _children(n0)
_on(n1, "click", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), ["stop"]))
@@ -102,8 +108,9 @@ export function render(_ctx) {
exports[`v-on > function expression w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", e => _ctx.foo(e))
@@ -114,8 +121,9 @@ export function render(_ctx) {
exports[`v-on > inline statement w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => (_ctx.foo($event)))
@@ -126,8 +134,9 @@ export function render(_ctx) {
exports[`v-on > multiple inline statements w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => {_ctx.foo($event);_ctx.bar()})
@@ -138,8 +147,9 @@ export function render(_ctx) {
exports[`v-on > should NOT add a prefix to $event if the expression is a function expression 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => {_ctx.i++;_ctx.foo($event)})
@@ -150,8 +160,9 @@ export function render(_ctx) {
exports[`v-on > should NOT wrap as function if expression is already function expression (with Typescript) 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", (e: any): any => _ctx.foo(e))
@@ -162,8 +173,9 @@ export function render(_ctx) {
exports[`v-on > should NOT wrap as function if expression is already function expression (with newlines) 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click",
@@ -178,8 +190,9 @@ export function render(_ctx) {
exports[`v-on > should NOT wrap as function if expression is already function expression 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => _ctx.foo($event))
@@ -190,8 +203,9 @@ export function render(_ctx) {
exports[`v-on > should NOT wrap as function if expression is complex member expression 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", (...args) => (_ctx.a['b' + _ctx.c] && _ctx.a['b' + _ctx.c](...args)))
@@ -202,8 +216,9 @@ export function render(_ctx) {
exports[`v-on > should handle multi-line statement 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => {
@@ -217,8 +232,9 @@ _ctx.bar()
exports[`v-on > should handle multiple inline statement 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => {_ctx.foo();_ctx.bar()})
@@ -229,8 +245,9 @@ export function render(_ctx) {
exports[`v-on > should not prefix member expression 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", (...args) => (_ctx.foo.bar && _ctx.foo.bar(...args)))
@@ -241,8 +258,9 @@ export function render(_ctx) {
exports[`v-on > should not wrap keys guard if no key modifier is present 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "keyup", _withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["exact"]))
@@ -253,8 +271,9 @@ export function render(_ctx) {
exports[`v-on > should support multiple events and modifiers options w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on, withKeys as _withKeys } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", _withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["stop"]))
@@ -266,8 +285,9 @@ export function render(_ctx) {
exports[`v-on > should support multiple modifiers and event options w/ prefixIdentifiers: true 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", _withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["stop", "prevent"]), { capture: true, once: true })
@@ -278,8 +298,9 @@ export function render(_ctx) {
exports[`v-on > should transform click.middle 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "mouseup", _withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["middle"]))
@@ -290,8 +311,9 @@ export function render(_ctx) {
exports[`v-on > should transform click.middle 2`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, withModifiers as _withModifiers, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -304,8 +326,9 @@ export function render(_ctx) {
exports[`v-on > should transform click.right 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "contextmenu", _withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["right"]))
@@ -316,8 +339,9 @@ export function render(_ctx) {
exports[`v-on > should transform click.right 2`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, withModifiers as _withModifiers, withKeys as _withKeys, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -330,8 +354,9 @@ export function render(_ctx) {
exports[`v-on > should wrap as function if expression is inline statement 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", $event => (_ctx.i++))
@@ -342,8 +367,9 @@ export function render(_ctx) {
exports[`v-on > should wrap both for dynamic key event w/ left/right modifiers 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, withModifiers as _withModifiers, withKeys as _withKeys, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -354,8 +380,9 @@ export function render(_ctx) {
`;
exports[`v-on > should wrap in unref if identifier is setup-maybe-ref w/ inline: true 1`] = `
-"(() => {
- const t0 = _template("
")
+"
+const t0 = _template("
")
+(() => {
const n0 = t0()
const { 0: [n1], 1: [n2], 2: [n3],} = _children(n0)
_on(n1, "click", $event => (x.value=_unref(y)))
@@ -368,8 +395,9 @@ exports[`v-on > should wrap in unref if identifier is setup-maybe-ref w/ inline:
exports[`v-on > should wrap keys guard for keyboard events or dynamic events 1`] = `
"import { template as _template, children as _children, withModifiers as _withModifiers, withKeys as _withKeys, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "keydown", _withKeys(_withModifiers((...args) => (_ctx.test && _ctx.test(...args)), ["stop", "ctrl"]), ["a"]), { capture: true })
@@ -380,8 +408,9 @@ export function render(_ctx) {
exports[`v-on > should wrap keys guard for static key event w/ left/right modifiers 1`] = `
"import { template as _template, children as _children, withKeys as _withKeys, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "keyup", _withKeys((...args) => (_ctx.test && _ctx.test(...args)), ["left"]))
@@ -392,8 +421,9 @@ export function render(_ctx) {
exports[`v-on > simple expression 1`] = `
"import { template as _template, children as _children, on as _on } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_on(n1, "click", (...args) => (_ctx.handleClick && _ctx.handleClick(...args)))
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
index 99a997442..bc380dd71 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`compiler: v-once > as root node 1`] = `
"import { template as _template, children as _children, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_setDynamicProp(n1, "id", _ctx.foo)
@@ -15,8 +16,9 @@ export function render(_ctx) {
exports[`compiler: v-once > basic 1`] = `
"import { template as _template, children as _children, createTextNode as _createTextNode, setText as _setText, setClass as _setClass, prepend as _prepend } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n3, { 1: [n2],}],} = _children(n0)
const n1 = _createTextNode()
@@ -30,8 +32,9 @@ export function render(_ctx) {
exports[`compiler: v-once > inside v-once 1`] = `
"import { template as _template } from 'vue/vapor';
+const t0 = _template("")
+
export function render(_ctx) {
- const t0 = _template("")
const n0 = t0()
return n0
}"
@@ -40,8 +43,9 @@ export function render(_ctx) {
exports[`compiler: v-once > on nested plain element 1`] = `
"import { template as _template, children as _children, setDynamicProp as _setDynamicProp } from 'vue/vapor';
+const t0 = _template("")
+
export function render(_ctx) {
- const t0 = _template("")
const n0 = t0()
const { 0: [, { 0: [n1],}],} = _children(n0)
_setDynamicProp(n1, "id", _ctx.foo)
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap
index 0de524c45..60f78a5d4 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap
@@ -3,8 +3,9 @@
exports[`v-text > should convert v-text to textContent 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -17,8 +18,9 @@ export function render(_ctx) {
exports[`v-text > should raise error and ignore children when v-text is present 1`] = `
"import { template as _template, children as _children, renderEffect as _renderEffect, setText as _setText } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_renderEffect(() => {
@@ -31,8 +33,9 @@ export function render(_ctx) {
exports[`v-text > should raise error if has no expression 1`] = `
"import { template as _template, children as _children, setText as _setText } from 'vue/vapor';
+const t0 = _template("
")
+
export function render(_ctx) {
- const t0 = _template("
")
const n0 = t0()
const { 0: [n1],} = _children(n0)
_setText(n1, "")
diff --git a/packages/compiler-vapor/src/generate.ts b/packages/compiler-vapor/src/generate.ts
index 1753f163a..998781b90 100644
--- a/packages/compiler-vapor/src/generate.ts
+++ b/packages/compiler-vapor/src/generate.ts
@@ -145,6 +145,13 @@ export function generate(
const context = new CodegenContext(ir, options)
const { push, helpers, vaporHelpers } = context
+ if (ir.template.length) {
+ ir.template.forEach((template, i) =>
+ push(...genTemplate(template, i, context)),
+ )
+ push(NEWLINE)
+ }
+
const functionName = 'render'
const isSetupInlined = !!options.inline
if (isSetupInlined) {
@@ -154,9 +161,6 @@ export function generate(
}
push(INDENT_START)
- ir.template.forEach((template, i) =>
- push(...genTemplate(template, i, context)),
- )
push(...genBlockFunctionContent(ir, context))
push(INDENT_END, NEWLINE)