diff --git a/packages/runtime-core/__tests__/components/Teleport.spec.ts b/packages/runtime-core/__tests__/components/Teleport.spec.ts
index 69a1c4cb2..40ffb836f 100644
--- a/packages/runtime-core/__tests__/components/Teleport.spec.ts
+++ b/packages/runtime-core/__tests__/components/Teleport.spec.ts
@@ -872,6 +872,23 @@ describe('renderer: teleport', () => {
       // children[0] is the start anchor
       expect(tRefInMounted).toBe(target.children[1])
     })
+
+    // 8146
+    test(`ensure correct rendering when target is empty`, async () => {
+      const root = nodeOps.createElement('div')
+      const App = {
+        setup() {
+          return () => h(Teleport, { to: null }, h('div', 'teleported'))
+        },
+      }
+      render(h(App), root)
+      await nextTick()
+      expect(serializeInner(root)).toMatchInlineSnapshot(
+        `"<!--teleport start--><div>teleported</div><!--teleport end-->"`,
+      )
+      expect(`Invalid Teleport target: null`).toHaveBeenWarnedTimes(1)
+      expect(`Invalid Teleport target on mount`).toHaveBeenWarnedTimes(1)
+    })
   }
 
   test('handle update and hmr rerender', async () => {
diff --git a/packages/runtime-core/src/components/Teleport.ts b/packages/runtime-core/src/components/Teleport.ts
index c37356a78..cf31d0c1c 100644
--- a/packages/runtime-core/src/components/Teleport.ts
+++ b/packages/runtime-core/src/components/Teleport.ts
@@ -158,7 +158,7 @@ export const TeleportImpl = {
         }
       }
 
-      if (disabled) {
+      if (disabled || !target) {
         mount(container, mainAnchor)
         updateCssVars(n2, true)
       }