[Vuejs]-Vue 3 Render Function: App Mounts Inside Root Element via innerHTML Instead of Replacing It

I found a way as a workaround to mimic the behaviour of vue 2.x app mounting by using fragments.

import { createApp, h } from 'vue';
import ContentApp from '@js/ContentApp';

const fragment = document.createDocumentFragment();
const targetEl = document.getElementById('vueContent');

const app = createApp({
  render: () => h(ContentApp, { ... }),
});
app.use(store);
// Temporarily mount the vue app on the fragment
app.mount(fragment);

// Now replace the target element with the fragment that has the app
targetEl.parentNode.replaceChild(fragment, targetEl);