Dynamic loading and rendering of a component?

Question

Vue.js

It is necessary, depending on the conditions, to load and render two components.
I'm trying like this:

new Vue({
  router,
  store,
  async render: h => isMobile ? h(await import('@/AppMobile.vue')) : h(await import('@/App.vue'))
}).$mount('#app')

Can you tell me what I'm doing wrong, or is there an easier way?

Answer 1

new Vue({
  router,
  store,
  components: {
    AppModile: () => import('@/AppMobile.vue'),
    App: () => import('@/App.vue')
  },
  render: h => h(isMobile ? 'AppMobile' : 'App')
}).$mount('#app')