Invalid vnode type when creating vnode

I am trying to use in my AppVue view to switch between different layouts, but when I access the page, the following warning is displayed:

[Vue warn]: Invalid vnode type when creating vnode: . at <AppVue> [runtime-core.esm-bundler.js:38](webpack://test/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?d2dd)

I don’t like warnings in my applications, so I was wondering where to look to fix this? I am using Vue 3 with composition api. I have tried to find the reason for this but now I am hoping to a better explanation on where to look… :slight_smile:
If a code example is needed, please let me know.

Please provide code related to your issue. Without it, it’s hard for us to help. You can refer to our guide on asking for help for more information. Thanks!

Ok, just created a quick test project and I get the same warning there, so this is a plain vue 3 project (“vue”: “^3.2.13”,“vue-router”: “^4.0.3”) using vue client 5.0.0.rc-2
And the AppVue looks like this:

<template>
  <component :is="layout" />
</template>

<script lang="ts">
import { useRoute } from 'vue-router'
import { ref, watch } from "vue";
import MainLayout from "@/components/MainLayout.vue";
import AuthLayout from "@/components/AuthLayout.vue";


export default {
  name: 'AppVue',
  components: {
    AuthLayout,
    MainLayout
  },
  setup() {
    const route = useRoute()

    const layout = ref('');

    watch(route, (to) => {
      // set layout by route meta
      if (to.meta.layout !== undefined) {
        layout.value = to.meta.layout as string
      } else {
        layout.value = "MainLayout" // this is default layout if route meta is not set
      }
      console.log(layout.value)
    })

    return {
      layout,
    }
  }
}
</script>

AuthLayout and MainLayout just contains a div with a text.

btw, just tried a test where I used the options api instead of the compoistion api, then the warning disappeared…
Is this something known with the compoistion api or?