From: Evan You <evan@vuejs.org>
Date: Mon, 9 Dec 2024 05:09:31 +0000 (+0800)
Subject: chore: make vapor compiler tests pass
X-Git-Tag: v3.6.0-alpha.1~16^2~192
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=4df462441568aa2a193964fa6ec428d2d59f8e3b;p=thirdparty%2Fvuejs%2Fcore.git

chore: make vapor compiler tests pass
---

diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
index 09e8c4ccaf..efa892543b 100644
--- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compile > bindings 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -12,7 +12,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > custom directive > basic 1`] = `
-"import { resolveDirective as _resolveDirective, withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { resolveDirective as _resolveDirective, withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -25,7 +25,7 @@ export function render(_ctx) {
 `;
 
 exports[`compile > custom directive > component 1`] = `
-"import { resolveComponent as _resolveComponent, resolveDirective as _resolveDirective, createComponent as _createComponent, withDirectives as _withDirectives, insert as _insert, createIf as _createIf, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, resolveDirective as _resolveDirective, createComponentWithFallback as _createComponentWithFallback, withDirectives as _withDirectives, insert as _insert, createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -33,27 +33,25 @@ export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
   const _directive_hello = _resolveDirective("hello")
   const _directive_test = _resolveDirective("test")
-  const n4 = _createComponent(_component_Comp, null, [
-    {
-      "default": () => {
-        const n0 = _createIf(() => (true), () => {
-          const n3 = t0()
-          const n2 = _createComponent(_component_Bar)
-          _withDirectives(n2, [[_directive_hello, void 0, void 0, { world: true }]])
-          _insert(n2, n3)
-          return n3
-        })
-        return n0
-      }
+  const n4 = _createComponentWithFallback(_component_Comp, null, {
+    "default": () => {
+      const n0 = _createIf(() => (true), () => {
+        const n3 = t0()
+        const n2 = _createComponentWithFallback(_component_Bar)
+        _withDirectives(n2, [[_directive_hello, void 0, void 0, { world: true }]])
+        _insert(n2, n3)
+        return n3
+      })
+      return n0
     }
-  ], true)
+  }, true)
   _withDirectives(n4, [[_directive_test]])
   return n4
 }"
 `;
 
 exports[`compile > directives > custom directive > basic 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -64,7 +62,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > binding value 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -75,7 +73,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > dynamic parameters 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -86,7 +84,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > modifiers 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -97,7 +95,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > modifiers w/o binding 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -108,7 +106,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > static parameters 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -119,7 +117,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > custom directive > static parameters and modifiers 1`] = `
-"import { withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -130,7 +128,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > v-cloak > basic 1`] = `
-"import { template as _template } from 'vue/vapor';
+"import { template as _template } from 'vue';
 const t0 = _template("<div>test</div>")
 
 export function render(_ctx) {
@@ -140,7 +138,7 @@ export function render(_ctx) {
 `;
 
 exports[`compile > directives > v-pre > basic 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<div :id=\\"foo\\"><Comp></Comp>{{ bar }}</div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -151,7 +149,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > directives > v-pre > should not affect siblings after it 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent, createTextNode as _createTextNode, insert as _insert, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, createTextNode as _createTextNode, insert as _insert, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div :id=\\"foo\\"><Comp></Comp>{{ bar }}</div>")
 const t1 = _template("<div></div>")
 
@@ -159,7 +157,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
   const _component_Comp = _resolveComponent("Comp")
   const n0 = t0()
   const n3 = t1()
-  const n1 = _createComponent(_component_Comp)
+  const n1 = _createComponentWithFallback(_component_Comp)
   const n2 = _createTextNode(() => [_ctx.bar])
   _insert([n1, n2], n3)
   _renderEffect(() => _setDOMProp(n3, "id", _ctx.foo))
@@ -168,7 +166,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compile > dynamic root 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createTextNode(() => [1, 2])
@@ -177,7 +175,7 @@ export function render(_ctx) {
 `;
 
 exports[`compile > dynamic root nodes and interpolation 1`] = `
-"import { delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, setDOMProp as _setDOMProp, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, setDOMProp as _setDOMProp, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<button></button>")
 _delegateEvents("click")
 
@@ -208,7 +206,7 @@ exports[`compile > expression parsing > v-bind 1`] = `
 `;
 
 exports[`compile > fragment 1`] = `
-"import { template as _template } from 'vue/vapor';
+"import { template as _template } from 'vue';
 const t0 = _template("<p></p>")
 const t1 = _template("<span></span>")
 const t2 = _template("<div></div>")
@@ -222,7 +220,7 @@ export function render(_ctx) {
 `;
 
 exports[`compile > static + dynamic root 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createTextNode(() => [1, 2, "3", 4, 5, "6", 7, 8, "9", 'A', 'B'])
@@ -231,7 +229,7 @@ export function render(_ctx) {
 `;
 
 exports[`compile > static template 1`] = `
-"import { template as _template } from 'vue/vapor';
+"import { template as _template } from 'vue';
 const t0 = _template("<div><p>hello</p><input><span></span></div>")
 
 export function render(_ctx) {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/expression.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/expression.spec.ts.snap
index 077e98dbdc..53e0ed772c 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/expression.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/expression.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: expression > basic 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createTextNode(() => [_ctx.a])
@@ -10,7 +10,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: expression > props 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createTextNode(() => [$props.foo])
@@ -19,7 +19,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compiler: expression > props aliased 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createTextNode(() => [$props['bar']])
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformChildren.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformChildren.spec.ts.snap
index 951a534ec6..54558eddc0 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformChildren.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformChildren.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: children transform > children & sibling references 1`] = `
-"import { next as _next, createTextNode as _createTextNode, insert as _insert, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { next as _next, createTextNode as _createTextNode, insert as _insert, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div><p></p> <!><p></p></div>")
 
 export function render(_ctx) {
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 961a6b4138..b3f5abfdc4 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformElement.spec.ts.snap
@@ -1,17 +1,17 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: element transform > component > do not resolve component from non-script-setup bindings 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const _component_Example = _resolveComponent("Example")
-  const n0 = _createComponent(_component_Example, null, null, true)
+  const n0 = _createComponentWithFallback(_component_Example, null, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > component > generate multi root component 1`] = `
-"import { createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { createComponent as _createComponent, template as _template } from 'vue';
 const t0 = _template("123")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -22,7 +22,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compiler: element transform > component > generate single root component 1`] = `
-"import { createComponent as _createComponent } from 'vue/vapor';
+"import { createComponent as _createComponent } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createComponent(_ctx.Comp, null, null, true)
@@ -31,11 +31,11 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compiler: element transform > component > import + resolve component 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, null, null, true)
+  const n0 = _createComponentWithFallback(_component_Foo, null, null, true)
   return n0
 }"
 `;
@@ -55,7 +55,7 @@ exports[`compiler: element transform > component > resolve component from setup
 `;
 
 exports[`compiler: element transform > component > resolve component from setup bindings 1`] = `
-"import { createComponent as _createComponent } from 'vue/vapor';
+"import { createComponent as _createComponent } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createComponent(_ctx.Example, null, null, true)
@@ -71,7 +71,7 @@ exports[`compiler: element transform > component > resolve namespaced component
 `;
 
 exports[`compiler: element transform > component > resolve namespaced component from props bindings (non-inline) 1`] = `
-"import { createComponent as _createComponent } from 'vue/vapor';
+"import { createComponent as _createComponent } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createComponent(_ctx.Foo.Example, null, null, true)
@@ -87,7 +87,7 @@ exports[`compiler: element transform > component > resolve namespaced component
 `;
 
 exports[`compiler: element transform > component > resolve namespaced component from setup bindings 1`] = `
-"import { createComponent as _createComponent } from 'vue/vapor';
+"import { createComponent as _createComponent } from 'vue';
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
   const n0 = _createComponent(_ctx.Foo.Example, null, null, true)
@@ -96,21 +96,21 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compiler: element transform > component > should wrap as function if v-on expression is inline statement 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { onBar: () => $event => (_ctx.handleBar($event)) }, null, true)
+  const n0 = _createComponentWithFallback(_component_Foo, { onBar: () => $event => (_ctx.handleBar($event)) }, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > component > static props 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, {
+  const n0 = _createComponentWithFallback(_component_Foo, {
     id: () => ("foo"), 
     class: () => ("bar")
   }, null, true)
@@ -119,11 +119,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component > v-bind="obj" 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { $: [
+  const n0 = _createComponentWithFallback(_component_Foo, { $: [
     () => (_ctx.obj)
   ] }, null, true)
   return n0
@@ -131,11 +131,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component > v-bind="obj" after static prop 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, {
+  const n0 = _createComponentWithFallback(_component_Foo, {
     id: () => ("foo"), 
     $: [
       () => (_ctx.obj)
@@ -146,11 +146,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component > v-bind="obj" before static prop 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { $: [
+  const n0 = _createComponentWithFallback(_component_Foo, { $: [
     () => (_ctx.obj), 
     { id: () => ("foo") }
   ] }, null, true)
@@ -159,11 +159,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component > v-bind="obj" between static props 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, {
+  const n0 = _createComponentWithFallback(_component_Foo, {
     id: () => ("foo"), 
     $: [
       () => (_ctx.obj), 
@@ -175,11 +175,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component > v-on="obj" 1`] = `
-"import { resolveComponent as _resolveComponent, toHandlers as _toHandlers, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, toHandlers as _toHandlers, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { $: [
+  const n0 = _createComponentWithFallback(_component_Foo, { $: [
     () => (_toHandlers(_ctx.obj))
   ] }, null, true)
   return n0
@@ -188,11 +188,11 @@ export function render(_ctx) {
 
 exports[`compiler: element transform > component with dynamic event arguments 1`] = `
 "import { toHandlerKey as _toHandlerKey } from 'vue';
-import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { $: [
+  const n0 = _createComponentWithFallback(_component_Foo, { $: [
     () => ({ [_toHandlerKey(_ctx.foo-_ctx.bar)]: () => _ctx.bar }), 
     () => ({ [_toHandlerKey(_ctx.baz)]: () => _ctx.qux })
   ] }, null, true)
@@ -201,11 +201,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > component with dynamic prop arguments 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Foo = _resolveComponent("Foo")
-  const n0 = _createComponent(_component_Foo, { $: [
+  const n0 = _createComponentWithFallback(_component_Foo, { $: [
     () => ({ [_ctx.foo-_ctx.bar]: _ctx.bar }), 
     () => ({ [_ctx.baz]: _ctx.qux })
   ] }, null, true)
@@ -214,47 +214,47 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > dynamic component > capitalized version w/ static binding 1`] = `
-"import { resolveDynamicComponent as _resolveDynamicComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveDynamicComponent as _resolveDynamicComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
-  const n0 = _createComponent(_resolveDynamicComponent("foo"), null, null, true)
+  const n0 = _createComponentWithFallback(_resolveDynamicComponent("foo"), null, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > dynamic component > dynamic binding 1`] = `
-"import { resolveDynamicComponent as _resolveDynamicComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveDynamicComponent as _resolveDynamicComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
-  const n0 = _createComponent(_resolveDynamicComponent(_ctx.foo), null, null, true)
+  const n0 = _createComponentWithFallback(_resolveDynamicComponent(_ctx.foo), null, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > dynamic component > dynamic binding shorthand 1`] = `
-"import { resolveDynamicComponent as _resolveDynamicComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveDynamicComponent as _resolveDynamicComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
-  const n0 = _createComponent(_resolveDynamicComponent(_ctx.is), null, null, true)
+  const n0 = _createComponentWithFallback(_resolveDynamicComponent(_ctx.is), null, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > dynamic component > normal component with is prop 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_custom_input = _resolveComponent("custom-input")
-  const n0 = _createComponent(_component_custom_input, { is: () => ("foo") }, null, true)
+  const n0 = _createComponentWithFallback(_component_custom_input, { is: () => ("foo") }, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: element transform > dynamic component > static binding 1`] = `
-"import { resolveDynamicComponent as _resolveDynamicComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveDynamicComponent as _resolveDynamicComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
-  const n0 = _createComponent(_resolveDynamicComponent("foo"), null, null, true)
+  const n0 = _createComponentWithFallback(_resolveDynamicComponent("foo"), null, null, true)
   return n0
 }"
 `;
@@ -267,7 +267,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > invalid html nesting 1`] = `
-"import { insert as _insert, template as _template } from 'vue/vapor';
+"import { insert as _insert, template as _template } from 'vue';
 const t0 = _template("<div>123</div>")
 const t1 = _template("<p></p>")
 const t2 = _template("<form></form>")
@@ -284,7 +284,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > props + children 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<div id=\\"foo\\"><span></span></div>")
 
 export function render(_ctx) {
@@ -295,7 +295,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > props merging: class 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setClass as _setClass, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setClass as _setClass, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -307,7 +307,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > props merging: event handlers 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -324,7 +324,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > props merging: style 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setStyle as _setStyle, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setStyle as _setStyle, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -336,7 +336,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > static props 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<div id=\\"foo\\" class=\\"bar\\"></div>")
 
 export function render(_ctx) {
@@ -347,7 +347,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > v-bind="obj" 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -359,7 +359,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > v-bind="obj" after static prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -371,7 +371,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > v-bind="obj" before static prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -383,7 +383,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > v-bind="obj" between static props 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -395,7 +395,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: element transform > v-on="obj" 1`] = `
-"import { renderEffect as _renderEffect, setDynamicEvents as _setDynamicEvents, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setDynamicEvents as _setDynamicEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformSlotOutlet.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformSlotOutlet.spec.ts.snap
index 2b9772aa0e..e7fc06fdd2 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformSlotOutlet.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformSlotOutlet.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: transform <slot> outlets > default slot outlet 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("default", null)
@@ -10,7 +10,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > default slot outlet with fallback 1`] = `
-"import { createSlot as _createSlot, template as _template } from 'vue/vapor';
+"import { createSlot as _createSlot, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -23,7 +23,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > default slot outlet with props & fallback 1`] = `
-"import { createSlot as _createSlot, template as _template } from 'vue/vapor';
+"import { createSlot as _createSlot, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -36,7 +36,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > default slot outlet with props 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("default", {
@@ -49,7 +49,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > dynamically named slot outlet 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot(() => (_ctx.foo + _ctx.bar), null)
@@ -58,7 +58,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > dynamically named slot outlet with v-bind shorthand 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot(() => (_ctx.name), null)
@@ -67,7 +67,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > error on unexpected custom directive on <slot> 1`] = `
-"import { resolveDirective as _resolveDirective, createSlot as _createSlot } from 'vue/vapor';
+"import { resolveDirective as _resolveDirective, createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const _directive_foo = _resolveDirective("foo")
@@ -77,7 +77,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > error on unexpected custom directive with v-show on <slot> 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("default", null)
@@ -86,7 +86,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > named slot outlet with fallback 1`] = `
-"import { createSlot as _createSlot, template as _template } from 'vue/vapor';
+"import { createSlot as _createSlot, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -99,7 +99,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > named slot outlet with props & fallback 1`] = `
-"import { createSlot as _createSlot, template as _template } from 'vue/vapor';
+"import { createSlot as _createSlot, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -112,7 +112,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > statically named slot outlet 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("foo", null)
@@ -121,7 +121,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > statically named slot outlet with props 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("foo", {
@@ -133,7 +133,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > statically named slot outlet with v-bind="obj" 1`] = `
-"import { createSlot as _createSlot } from 'vue/vapor';
+"import { createSlot as _createSlot } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("foo", {
@@ -148,7 +148,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: transform <slot> outlets > statically named slot outlet with v-on 1`] = `
-"import { createSlot as _createSlot, toHandlers as _toHandlers } from 'vue/vapor';
+"import { createSlot as _createSlot, toHandlers as _toHandlers } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createSlot("default", {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
index a600199256..776ba351b1 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformTemplateRef.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: template ref transform > dynamic ref 1`] = `
-"import { renderEffect as _renderEffect, setRef as _setRef, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setRef as _setRef, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -13,7 +13,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: template ref transform > ref + v-for 1`] = `
-"import { setRef as _setRef, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { setRef as _setRef, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -27,7 +27,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: template ref transform > ref + v-if 1`] = `
-"import { setRef as _setRef, createIf as _createIf, template as _template } from 'vue/vapor';
+"import { setRef as _setRef, createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -41,7 +41,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: template ref transform > static ref 1`] = `
-"import { setRef as _setRef, template as _template } from 'vue/vapor';
+"import { setRef as _setRef, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformText.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
index 5cd9a4002e..cdc6984834 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/transformText.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: text transform > consecutive text 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createTextNode(() => [_ctx.msg])
@@ -10,7 +10,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: text transform > no consecutive text 1`] = `
-"import { createTextNode as _createTextNode } from 'vue/vapor';
+"import { createTextNode as _createTextNode } from 'vue';
 
 export function render(_ctx) {
   const n0 = _createTextNode(["hello world"])
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 05938f25cb..a806a66b4e 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vBind.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler v-bind > .attr modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -13,7 +13,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .attr modifier w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -25,7 +25,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .attr modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -37,7 +37,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .attr modifier w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<progress></progress>")
 
 export function render(_ctx) {
@@ -49,7 +49,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .attr modifier w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -61,7 +61,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .attr modifier w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -73,7 +73,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .camel modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -86,7 +86,7 @@ export function render(_ctx) {
 
 exports[`compiler v-bind > .camel modifier w/ dynamic arg 1`] = `
 "import { camelize as _camelize } from 'vue';
-import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -98,7 +98,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .camel modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -110,7 +110,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -122,7 +122,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -134,7 +134,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -146,7 +146,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<progress></progress>")
 
 export function render(_ctx) {
@@ -158,7 +158,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -170,7 +170,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier (shorthand) w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -182,7 +182,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -194,7 +194,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ dynamic arg 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -206,7 +206,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -218,7 +218,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -230,7 +230,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ progress value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<progress></progress>")
 
 export function render(_ctx) {
@@ -242,7 +242,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ textContent 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -254,7 +254,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > .prop modifier w/ value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -266,7 +266,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > :innerHTML 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -278,7 +278,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > :textContext 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -290,7 +290,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > :value 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setValue as _setValue, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -302,7 +302,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > :value w/ progress 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
 const t0 = _template("<progress></progress>")
 
 export function render(_ctx) {
@@ -314,7 +314,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > HTML global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -330,7 +330,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > MathML global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<math></math>")
 
 export function render(_ctx) {
@@ -346,7 +346,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > SVG global attributes should set as dom prop 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<svg></svg>")
 
 export function render(_ctx) {
@@ -360,7 +360,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > attributes must be set as attribute 1`] = `
-"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setAttr as _setAttr, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<input>")
 const t2 = _template("<textarea></textarea>")
@@ -400,7 +400,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > basic 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -412,7 +412,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > dynamic arg 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -424,7 +424,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > dynamic arg w/ static attribute 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -436,7 +436,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > no expression (shorthand) 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -448,7 +448,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > no expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -460,17 +460,17 @@ export function render(_ctx) {
 `;
 
 exports[`compiler v-bind > number value 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { depth: () => (0) }, null, true)
+  const n0 = _createComponentWithFallback(_component_Comp, { depth: () => (0) }, null, true)
   return n0
 }"
 `;
 
 exports[`compiler v-bind > should error if empty expression 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<div arg></div>")
 
 export function render(_ctx) {
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 a82221728a..e5913b4ca3 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: v-for > array de-structured value 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -15,7 +15,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > basic v-for 1`] = `
-"import { delegate as _delegate, renderEffect as _renderEffect, setText as _setText, createFor as _createFor, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, renderEffect as _renderEffect, setText as _setText, createFor as _createFor, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -31,7 +31,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > function params w/ prefixIdentifiers: false 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -45,7 +45,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > multi effect 1`] = `
-"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProp as _setDynamicProp, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -61,7 +61,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > nested v-for 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, createFor as _createFor, insert as _insert, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, createFor as _createFor, insert as _insert, template as _template } from 'vue';
 const t0 = _template("<span></span>")
 const t1 = _template("<div></div>")
 
@@ -81,7 +81,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > object de-structured value 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -95,7 +95,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > v-for aliases w/ complex expressions 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, withDestructure as _withDestructure, createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -109,7 +109,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-for > w/o value 1`] = `
-"import { createFor as _createFor, template as _template } from 'vue/vapor';
+"import { createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div>item</div>")
 
 export function render(_ctx) {
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 a5ee792e2d..110fea9161 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vHtml.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`v-html > should convert v-html to innerHTML 1`] = `
-"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -12,7 +12,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`v-html > should raise error and ignore children when v-html is present 1`] = `
-"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -23,7 +23,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-html > should raise error if has no expression 1`] = `
-"import { setHtml as _setHtml, template as _template } from 'vue/vapor';
+"import { setHtml as _setHtml, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
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 3d92452a16..6638062fc8 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vIf.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: v-if > basic v-if 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, createIf as _createIf, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -15,7 +15,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > comment between branches 1`] = `
-"import { createIf as _createIf, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<!--foo-->")
 const t2 = _template("<p></p>")
@@ -43,7 +43,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > dedupe same template 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div>hello</div>")
 
 export function render(_ctx) {
@@ -60,7 +60,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > template v-if 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, createIf as _createIf, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("hello")
 const t2 = _template("<p></p>")
@@ -78,7 +78,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > v-if + v-else 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<p></p>")
 
@@ -95,7 +95,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > v-if + v-else-if + v-else 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<p></p>")
 const t2 = _template("fine")
@@ -116,7 +116,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-if > v-if + v-else-if 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<p></p>")
 
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap
index 4951244841..14300b6f55 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap
@@ -1,11 +1,11 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: vModel transform > component > v-model for component should generate modelModifiers 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { modelValue: () => (_ctx.foo),
+  const n0 = _createComponentWithFallback(_component_Comp, { modelValue: () => (_ctx.foo),
   "onUpdate:modelValue": () => $event => (_ctx.foo = $event),
   modelModifiers: () => ({ trim: true, "bar-baz": true }) }, null, true)
   return n0
@@ -13,22 +13,22 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > component > v-model for component should work 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { modelValue: () => (_ctx.foo),
+  const n0 = _createComponentWithFallback(_component_Comp, { modelValue: () => (_ctx.foo),
   "onUpdate:modelValue": () => $event => (_ctx.foo = $event) }, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: vModel transform > component > v-model with arguments for component should generate modelModifiers 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, {
+  const n0 = _createComponentWithFallback(_component_Comp, {
     foo: () => (_ctx.foo),
     "onUpdate:foo": () => $event => (_ctx.foo = $event),
     fooModifiers: () => ({ trim: true }), 
@@ -41,22 +41,22 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > component > v-model with arguments for component should work 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { bar: () => (_ctx.foo),
+  const n0 = _createComponentWithFallback(_component_Comp, { bar: () => (_ctx.foo),
   "onUpdate:bar": () => $event => (_ctx.foo = $event) }, null, true)
   return n0
 }"
 `;
 
 exports[`compiler: vModel transform > component > v-model with dynamic arguments for component should generate modelModifiers  1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { $: [
+  const n0 = _createComponentWithFallback(_component_Comp, { $: [
     () => ({ [_ctx.foo]: _ctx.foo,
     ["onUpdate:" + _ctx.foo]: () => $event => (_ctx.foo = $event),
     [_ctx.foo + "Modifiers"]: () => ({ trim: true }) }), 
@@ -69,11 +69,11 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > component > v-model with dynamic arguments for component should work 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n0 = _createComponent(_component_Comp, { $: [
+  const n0 = _createComponentWithFallback(_component_Comp, { $: [
     () => ({ [_ctx.arg]: _ctx.foo,
     ["onUpdate:" + _ctx.arg]: () => $event => (_ctx.foo = $event) })
   ] }, null, true)
@@ -82,7 +82,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > modifiers > .lazy 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -94,7 +94,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > modifiers > .number 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -106,7 +106,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > modifiers > .trim 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -118,7 +118,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support input (checkbox) 1`] = `
-"import { vModelCheckbox as _vModelCheckbox, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { vModelCheckbox as _vModelCheckbox, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<input type=\\"checkbox\\">")
 
 export function render(_ctx) {
@@ -131,7 +131,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support input (dynamic type) 1`] = `
-"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -143,7 +143,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support input (radio) 1`] = `
-"import { vModelRadio as _vModelRadio, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { vModelRadio as _vModelRadio, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<input type=\\"radio\\">")
 
 export function render(_ctx) {
@@ -156,7 +156,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support input (text) 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<input type=\\"text\\">")
 
 export function render(_ctx) {
@@ -169,7 +169,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support member expression 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -202,7 +202,7 @@ exports[`compiler: vModel transform > should support member expression w/ inline
 `;
 
 exports[`compiler: vModel transform > should support select 1`] = `
-"import { vModelSelect as _vModelSelect, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelSelect as _vModelSelect, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<select></select>")
 
 export function render(_ctx) {
@@ -214,7 +214,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support simple expression 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -226,7 +226,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support textarea 1`] = `
-"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelText as _vModelText, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<textarea></textarea>")
 
 export function render(_ctx) {
@@ -238,7 +238,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support w/ dynamic v-bind 1`] = `
-"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue/vapor';
+"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, setInheritAttrs as _setInheritAttrs, renderEffect as _renderEffect, setDynamicProps as _setDynamicProps, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
@@ -252,7 +252,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: vModel transform > should support w/ dynamic v-bind 2`] = `
-"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue/vapor';
+"import { vModelDynamic as _vModelDynamic, withDirectives as _withDirectives, delegate as _delegate, template as _template } from 'vue';
 const t0 = _template("<input>")
 
 export function render(_ctx) {
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 cbd195b83e..5586d1a56f 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOn.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`v-on > complex member expression w/ prefixIdentifiers: true 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -13,7 +13,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > dynamic arg 1`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -28,7 +28,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > dynamic arg with complex exp prefixing 1`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -43,7 +43,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > dynamic arg with prefixing 1`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -58,7 +58,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > event modifier 1`] = `
-"import { delegate as _delegate, on as _on, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, on as _on, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<a></a>")
 const t1 = _template("<form></form>")
 const t2 = _template("<div></div>")
@@ -161,7 +161,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`v-on > function expression w/ prefixIdentifiers: true 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -173,7 +173,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > inline statement w/ prefixIdentifiers: true 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -185,7 +185,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > multiple inline statements w/ prefixIdentifiers: true 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -197,7 +197,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should NOT add a prefix to $event if the expression is a function expression 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -209,7 +209,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should NOT wrap as function if expression is already function expression (with Typescript) 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -221,7 +221,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should NOT wrap as function if expression is already function expression (with newlines) 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -237,7 +237,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should NOT wrap as function if expression is already function expression 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -249,7 +249,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should NOT wrap as function if expression is complex member expression 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -261,7 +261,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should delegate event 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -273,7 +273,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should handle multi-line statement 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -288,7 +288,7 @@ _ctx.bar()
 `;
 
 exports[`v-on > should handle multiple inline statement 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -300,7 +300,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should not prefix member expression 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -312,7 +312,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should not wrap keys guard if no key modifier is present 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("keyup")
 
@@ -326,7 +326,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should support multiple events and modifiers options w/ prefixIdentifiers: true 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click", "keyup")
 
@@ -343,7 +343,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should support multiple modifiers and event options w/ prefixIdentifiers: true 1`] = `
-"import { on as _on, template as _template } from 'vue/vapor';
+"import { on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -358,7 +358,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should transform click.middle 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("mouseup")
 
@@ -372,7 +372,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should transform click.middle 2`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -388,7 +388,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should transform click.right 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("contextmenu")
 
@@ -402,7 +402,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should transform click.right 2`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -419,7 +419,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should wrap as function if expression is inline statement 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
@@ -431,7 +431,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should wrap both for dynamic key event w/ left/right modifiers 1`] = `
-"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -460,7 +460,7 @@ 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 { on as _on, template as _template } from 'vue/vapor';
+"import { on as _on, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -475,7 +475,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > should wrap keys guard for static key event w/ left/right modifiers 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("keyup")
 
@@ -489,7 +489,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-on > simple expression 1`] = `
-"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue/vapor';
+"import { delegate as _delegate, delegateEvents as _delegateEvents, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 _delegateEvents("click")
 
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 91edd536aa..db054562dd 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: v-once > as root node 1`] = `
-"import { setDOMProp as _setDOMProp, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue/vapor';
+"import { setDOMProp as _setDOMProp, setInheritAttrs as _setInheritAttrs, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -13,7 +13,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-once > basic 1`] = `
-"import { createTextNode as _createTextNode, setClass as _setClass, prepend as _prepend, template as _template } from 'vue/vapor';
+"import { createTextNode as _createTextNode, setClass as _setClass, prepend as _prepend, template as _template } from 'vue';
 const t0 = _template("<div><span></span></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -27,7 +27,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`compiler: v-once > inside v-once 1`] = `
-"import { template as _template } from 'vue/vapor';
+"import { template as _template } from 'vue';
 const t0 = _template("<div><div></div></div>")
 
 export function render(_ctx) {
@@ -37,20 +37,20 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-once > on component 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent, insert as _insert, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, insert as _insert, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
   const n1 = t0()
-  const n0 = _createComponent(_component_Comp, { id: () => (_ctx.foo) }, null, null, true)
+  const n0 = _createComponentWithFallback(_component_Comp, { id: () => (_ctx.foo) }, null, null, true)
   _insert(n0, n1)
   return n1
 }"
 `;
 
 exports[`compiler: v-once > on nested plain element 1`] = `
-"import { setDOMProp as _setDOMProp, template as _template } from 'vue/vapor';
+"import { setDOMProp as _setDOMProp, template as _template } from 'vue';
 const t0 = _template("<div><div></div></div>")
 
 export function render(_ctx) {
@@ -62,7 +62,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-once > with v-for 1`] = `
-"import { createFor as _createFor, template as _template } from 'vue/vapor';
+"import { createFor as _createFor, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -75,7 +75,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-once > with v-if 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -88,7 +88,7 @@ export function render(_ctx) {
 `;
 
 exports[`compiler: v-once > with v-if/else 1`] = `
-"import { createIf as _createIf, template as _template } from 'vue/vapor';
+"import { createIf as _createIf, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 const t1 = _template("<p></p>")
 
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vShow.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vShow.spec.ts.snap
index cf8f06b220..87ed1b461e 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vShow.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vShow.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: v-show transform > simple expression 1`] = `
-"import { vShow as _vShow, withDirectives as _withDirectives, template as _template } from 'vue/vapor';
+"import { vShow as _vShow, withDirectives as _withDirectives, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap
index d4005e6d24..334efa7455 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap
@@ -1,252 +1,245 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiler: transform slot > dynamic slots name 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template("foo")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n2 = _createComponent(_component_Comp, null, [
-    () => ({
-      name: _ctx.name, 
-      fn: () => {
-        const n0 = t0()
-        return n0
-      }
-    })
-  ], true)
+  const n2 = _createComponentWithFallback(_component_Comp, null, {
+    $: [
+      () => ({
+        name: _ctx.name, 
+        fn: () => {
+          const n0 = t0()
+          return n0
+        }
+      })
+    ]
+  }, true)
   return n2
 }"
 `;
 
 exports[`compiler: transform slot > dynamic slots name w/ v-for 1`] = `
-"import { resolveComponent as _resolveComponent, withDestructure as _withDestructure, createForSlots as _createForSlots, createComponent as _createComponent, template as _template } from 'vue/vapor';
-const t0 = _template("foo")
+"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, createForSlots as _createForSlots, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n2 = _createComponent(_component_Comp, null, [
-    () => (_createForSlots(_ctx.list, (item) => ({
-      name: item, 
-      fn: _withDestructure(({ bar }) => [bar], (_ctx0) => {
-        const n0 = t0()
-        return n0
-      })
-    })))
-  ], true)
+  const n2 = _createComponentWithFallback(_component_Comp, null, {
+    $: [
+      () => (_createForSlots(_ctx.list, (item) => ({
+        name: item, 
+        fn: (_slotProps0) => {
+          const n0 = _createTextNode(() => [_slotProps0["bar"]])
+          return n0
+        }
+      })))
+    ]
+  }, true)
   return n2
 }"
 `;
 
 exports[`compiler: transform slot > dynamic slots name w/ v-for and provide absent key 1`] = `
-"import { resolveComponent as _resolveComponent, createForSlots as _createForSlots, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createForSlots as _createForSlots, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template("foo")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n2 = _createComponent(_component_Comp, null, [
-    () => (_createForSlots(_ctx.list, (_, __, index) => ({
-      name: index, 
-      fn: () => {
-        const n0 = t0()
-        return n0
-      }
-    })))
-  ], true)
+  const n2 = _createComponentWithFallback(_component_Comp, null, {
+    $: [
+      () => (_createForSlots(_ctx.list, (_, __, index) => ({
+        name: index, 
+        fn: () => {
+          const n0 = t0()
+          return n0
+        }
+      })))
+    ]
+  }, true)
   return n2
 }"
 `;
 
 exports[`compiler: transform slot > dynamic slots name w/ v-if / v-else[-if] 1`] = `
-"import { resolveComponent as _resolveComponent, withDestructure as _withDestructure, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template("condition slot")
 const t1 = _template("another condition")
 const t2 = _template("else condition")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n6 = _createComponent(_component_Comp, null, [
-    () => (_ctx.condition
-      ? {
-        name: "condition", 
-        fn: () => {
-          const n0 = t0()
-          return n0
-        }
-      }
-      : _ctx.anotherCondition
+  const n6 = _createComponentWithFallback(_component_Comp, null, {
+    $: [
+      () => (_ctx.condition
         ? {
-          name: "condition", 
-          fn: _withDestructure(({ foo, bar }) => [foo, bar], (_ctx0) => {
-            const n2 = t1()
-            return n2
-          })
-        }
-        : {
           name: "condition", 
           fn: () => {
-            const n4 = t2()
-            return n4
+            const n0 = t0()
+            return n0
+          }
+        }
+        : _ctx.anotherCondition
+          ? {
+            name: "condition", 
+            fn: (_slotProps0) => {
+              const n2 = t1()
+              return n2
+            }
           }
-        })
-  ], true)
+          : {
+            name: "condition", 
+            fn: () => {
+              const n4 = t2()
+              return n4
+            }
+          })
+    ]
+  }, true)
   return n6
 }"
 `;
 
 exports[`compiler: transform slot > implicit default slot 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n1 = _createComponent(_component_Comp, null, [
-    {
-      "default": () => {
-        const n0 = t0()
-        return n0
-      }
+  const n1 = _createComponentWithFallback(_component_Comp, null, {
+    "default": () => {
+      const n0 = t0()
+      return n0
     }
-  ], true)
+  }, true)
   return n1
 }"
 `;
 
 exports[`compiler: transform slot > named slots w/ implicit default slot 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template("foo")
 const t1 = _template("bar")
 const t2 = _template("<span></span>")
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n4 = _createComponent(_component_Comp, null, [
-    {
-      "one": () => {
-        const n0 = t0()
-        return n0
-      }, 
-      "default": () => {
-        const n2 = t1()
-        const n3 = t2()
-        return [n2, n3]
-      }
+  const n4 = _createComponentWithFallback(_component_Comp, null, {
+    "one": () => {
+      const n0 = t0()
+      return n0
+    }, 
+    "default": () => {
+      const n2 = t1()
+      const n3 = t2()
+      return [n2, n3]
     }
-  ], true)
+  }, true)
   return n4
 }"
 `;
 
 exports[`compiler: transform slot > nested component slot 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_B = _resolveComponent("B")
   const _component_A = _resolveComponent("A")
-  const n1 = _createComponent(_component_A, null, [
-    {
-      "default": () => {
-        const n0 = _createComponent(_component_B)
-        return n0
-      }
+  const n1 = _createComponentWithFallback(_component_A, null, {
+    "default": () => {
+      const n0 = _createComponentWithFallback(_component_B)
+      return n0
     }
-  ], true)
+  }, true)
   return n1
 }"
 `;
 
 exports[`compiler: transform slot > nested slots scoping 1`] = `
-"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, withDestructure as _withDestructure, createComponent as _createComponent, template as _template } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, createComponentWithFallback as _createComponentWithFallback, template as _template } from 'vue';
 const t0 = _template(" ")
 
 export function render(_ctx) {
   const _component_Inner = _resolveComponent("Inner")
   const _component_Comp = _resolveComponent("Comp")
-  const n5 = _createComponent(_component_Comp, null, [
-    {
-      "default": _withDestructure(({ foo }) => [foo], (_ctx0) => {
-        const n2 = t0()
-        const n1 = _createComponent(_component_Inner, null, [
-          {
-            "default": _withDestructure(({ bar }) => [bar], (_ctx1) => {
-              const n0 = _createTextNode(() => [_ctx0[0] + _ctx1[0] + _ctx.baz])
-              return n0
-            })
-          }
-        ])
-        const n3 = _createTextNode(() => [_ctx0[0] + _ctx.bar + _ctx.baz])
-        return [n1, n2, n3]
+  const n5 = _createComponentWithFallback(_component_Comp, null, {
+    "default": (_slotProps0) => {
+      const n2 = t0()
+      const n1 = _createComponentWithFallback(_component_Inner, null, {
+        "default": (_slotProps1) => {
+          const n0 = _createTextNode(() => [_slotProps0["foo"] + _slotProps1["bar"] + _ctx.baz])
+          return n0
+        }
       })
+      const n3 = _createTextNode(() => [_slotProps0["foo"] + _ctx.bar + _ctx.baz])
+      return [n1, n2, n3]
     }
-  ], true)
+  }, true)
   return n5
 }"
 `;
 
 exports[`compiler: transform slot > on component dynamically named slot 1`] = `
-"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, withDestructure as _withDestructure, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n1 = _createComponent(_component_Comp, null, [
-    () => ({
-      name: _ctx.named, 
-      fn: _withDestructure(({ foo }) => [foo], (_ctx0) => {
-        const n0 = _createTextNode(() => [_ctx0[0] + _ctx.bar])
-        return n0
+  const n1 = _createComponentWithFallback(_component_Comp, null, {
+    $: [
+      () => ({
+        name: _ctx.named, 
+        fn: (_slotProps0) => {
+          const n0 = _createTextNode(() => [_slotProps0["foo"] + _ctx.bar])
+          return n0
+        }
       })
-    })
-  ], true)
+    ]
+  }, true)
   return n1
 }"
 `;
 
 exports[`compiler: transform slot > on component named slot 1`] = `
-"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, withDestructure as _withDestructure, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n1 = _createComponent(_component_Comp, null, [
-    {
-      "named": _withDestructure(({ foo }) => [foo], (_ctx0) => {
-        const n0 = _createTextNode(() => [_ctx0[0] + _ctx.bar])
-        return n0
-      })
+  const n1 = _createComponentWithFallback(_component_Comp, null, {
+    "named": (_slotProps0) => {
+      const n0 = _createTextNode(() => [_slotProps0["foo"] + _ctx.bar])
+      return n0
     }
-  ], true)
+  }, true)
   return n1
 }"
 `;
 
 exports[`compiler: transform slot > on-component default slot 1`] = `
-"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, withDestructure as _withDestructure, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createTextNode as _createTextNode, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n1 = _createComponent(_component_Comp, null, [
-    {
-      "default": _withDestructure(({ foo }) => [foo], (_ctx0) => {
-        const n0 = _createTextNode(() => [_ctx0[0] + _ctx.bar])
-        return n0
-      })
+  const n1 = _createComponentWithFallback(_component_Comp, null, {
+    "default": (_slotProps0) => {
+      const n0 = _createTextNode(() => [_slotProps0["foo"] + _ctx.bar])
+      return n0
     }
-  ], true)
+  }, true)
   return n1
 }"
 `;
 
 exports[`compiler: transform slot > quote slot name 1`] = `
-"import { resolveComponent as _resolveComponent, createComponent as _createComponent } from 'vue/vapor';
+"import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
-  const n1 = _createComponent(_component_Comp, null, [
-    {
-      "nav-bar-title-before": () => {
-        return null
-      }
+  const n1 = _createComponentWithFallback(_component_Comp, null, {
+    "nav-bar-title-before": () => {
+      return null
     }
-  ], true)
+  }, true)
   return n1
 }"
 `;
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 622966ba8d..506913184a 100644
--- a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vText.spec.ts.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`v-text > should convert v-text to textContent 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx, $props, $emit, $attrs, $slots) {
@@ -12,7 +12,7 @@ export function render(_ctx, $props, $emit, $attrs, $slots) {
 `;
 
 exports[`v-text > should raise error and ignore children when v-text is present 1`] = `
-"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue/vapor';
+"import { renderEffect as _renderEffect, setText as _setText, template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
@@ -23,7 +23,7 @@ export function render(_ctx) {
 `;
 
 exports[`v-text > should raise error if has no expression 1`] = `
-"import { template as _template } from 'vue/vapor';
+"import { template as _template } from 'vue';
 const t0 = _template("<div></div>")
 
 export function render(_ctx) {
diff --git a/packages/compiler-vapor/__tests__/transforms/transformElement.spec.ts b/packages/compiler-vapor/__tests__/transforms/transformElement.spec.ts
index 8b7baee40e..49dd62aacf 100644
--- a/packages/compiler-vapor/__tests__/transforms/transformElement.spec.ts
+++ b/packages/compiler-vapor/__tests__/transforms/transformElement.spec.ts
@@ -29,7 +29,7 @@ describe('compiler: element transform', () => {
       expect(code).toMatchSnapshot()
       expect(vaporHelpers).contains.all.keys(
         'resolveComponent',
-        'createComponent',
+        'createComponentWithFallback',
       )
       expect(ir.block.operation).toMatchObject([
         {
diff --git a/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts b/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts
index 5cd8080faa..b3b1e6b19a 100644
--- a/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts
+++ b/packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts
@@ -64,14 +64,13 @@ describe('compiler: transform slot', () => {
   })
 
   test('on-component default slot', () => {
-    const { ir, code, vaporHelpers } = compileWithSlots(
+    const { ir, code } = compileWithSlots(
       `<Comp v-slot="{ foo }">{{ foo + bar }}</Comp>`,
     )
     expect(code).toMatchSnapshot()
 
-    expect(vaporHelpers).contains('withDestructure')
-    expect(code).contains(`({ foo }) => [foo]`)
-    expect(code).contains(`_ctx0[0] + _ctx.bar`)
+    expect(code).contains(`"default": (_slotProps0) =>`)
+    expect(code).contains(`_slotProps0["foo"] + _ctx.bar`)
 
     expect(ir.block.operation).toMatchObject([
       {
@@ -106,8 +105,8 @@ describe('compiler: transform slot', () => {
     )
     expect(code).toMatchSnapshot()
 
-    expect(code).contains(`({ foo }) => [foo]`)
-    expect(code).contains(`_ctx0[0] + _ctx.bar`)
+    expect(code).contains(`"named": (_slotProps0) =>`)
+    expect(code).contains(`_slotProps0["foo"] + _ctx.bar`)
 
     expect(ir.block.operation).toMatchObject([
       {
@@ -132,14 +131,13 @@ describe('compiler: transform slot', () => {
   })
 
   test('on component dynamically named slot', () => {
-    const { ir, code, vaporHelpers } = compileWithSlots(
+    const { ir, code } = compileWithSlots(
       `<Comp v-slot:[named]="{ foo }">{{ foo + bar }}</Comp>`,
     )
     expect(code).toMatchSnapshot()
 
-    expect(vaporHelpers).contains('withDestructure')
-    expect(code).contains(`({ foo }) => [foo]`)
-    expect(code).contains(`_ctx0[0] + _ctx.bar`)
+    expect(code).contains(`fn: (_slotProps0) =>`)
+    expect(code).contains(`_slotProps0["foo"] + _ctx.bar`)
 
     expect(ir.block.operation).toMatchObject([
       {
@@ -204,7 +202,7 @@ describe('compiler: transform slot', () => {
   })
 
   test('nested slots scoping', () => {
-    const { ir, code, vaporHelpers } = compileWithSlots(
+    const { ir, code } = compileWithSlots(
       `<Comp>
         <template #default="{ foo }">
           <Inner v-slot="{ bar }">
@@ -216,11 +214,10 @@ describe('compiler: transform slot', () => {
     )
     expect(code).toMatchSnapshot()
 
-    expect(vaporHelpers).contains('withDestructure')
-    expect(code).contains(`({ foo }) => [foo]`)
-    expect(code).contains(`({ bar }) => [bar]`)
-    expect(code).contains(`_ctx0[0] + _ctx1[0] + _ctx.baz`)
-    expect(code).contains(`_ctx0[0] + _ctx.bar + _ctx.baz`)
+    expect(code).contains(`"default": (_slotProps0) =>`)
+    expect(code).contains(`"default": (_slotProps1) =>`)
+    expect(code).contains(`_slotProps0["foo"] + _slotProps1["bar"] + _ctx.baz`)
+    expect(code).contains(`_slotProps0["foo"] + _ctx.bar + _ctx.baz`)
 
     expect(ir.block.operation).toMatchObject([
       {
@@ -292,15 +289,15 @@ describe('compiler: transform slot', () => {
   })
 
   test('dynamic slots name w/ v-for', () => {
-    const { ir, code, vaporHelpers } = compileWithSlots(
+    const { ir, code } = compileWithSlots(
       `<Comp>
-        <template v-for="item in list" #[item]="{ bar }">foo</template>
+        <template v-for="item in list" #[item]="{ bar }">{{ bar }}</template>
       </Comp>`,
     )
     expect(code).toMatchSnapshot()
 
-    expect(vaporHelpers).contains('withDestructure')
-    expect(code).contains(`({ bar }) => [bar]`)
+    expect(code).contains(`fn: (_slotProps0) =>`)
+    expect(code).contains(`_createTextNode(() => [_slotProps0["bar"]])`)
 
     expect(ir.block.operation[0].type).toBe(IRNodeTypes.CREATE_COMPONENT_NODE)
     expect(ir.block.operation).toMatchObject([
@@ -360,7 +357,7 @@ describe('compiler: transform slot', () => {
   })
 
   test('dynamic slots name w/ v-if / v-else[-if]', () => {
-    const { ir, code, vaporHelpers } = compileWithSlots(
+    const { ir, code } = compileWithSlots(
       `<Comp>
         <template v-if="condition" #condition>condition slot</template>
         <template v-else-if="anotherCondition" #condition="{ foo, bar }">another condition</template>
@@ -369,8 +366,7 @@ describe('compiler: transform slot', () => {
     )
     expect(code).toMatchSnapshot()
 
-    expect(vaporHelpers).contains('withDestructure')
-    expect(code).contains(`({ foo, bar }) => [foo, bar]`)
+    expect(code).contains(`fn: (_slotProps0) =>`)
 
     expect(ir.block.operation[0].type).toBe(IRNodeTypes.CREATE_COMPONENT_NODE)
     expect(ir.block.operation).toMatchObject([