How to render only components in vue 3 without replacing the root element?

Question

Vue.js

Previously, by default, the view had a component rendering mode, when we simply indicated:

new Vue({
    el: "#app"
})

And in version 3 there is an option only to mount it in the house with a complete replacement of the root element. Is it possible in version 3 to do the same as it was before, so that only the components are parsed, without completely replacing the content?
Vue.createApp(RootComponent).mount('#app')

Answer 1

Yes, it is possible:

import { createApp } from 'vue';

createApp({
  components: {
    // Список компонентов, которые могут использоваться в шаблоне 
  },
})
  .use(store)
  .mount('#app');

The only point is that you need to use an assembly that supports template parsing when connecting. By default, a smaller build without this feature is used, and vue-loader is responsible for parsing the templates.
To make the code above work, you can either fix the import on 'vue/dist/vue.esm-bundler.js'', or add a section to vue.config.js:

const buildConfig = {
  // Может быть что-то выше
  configureWebpack: {
    resolve: {
      alias: {
        vue$: 'vue/dist/vue.esm-bundler.js',
      },
    },
  },
  // Может еще что-то
};

module.exports = buildConfig;