I am using Vue 3 to develop a google chrome app, now I am initial the vue 3 root component like this in the index.js:

if ( process.env.NODE_ENV !== 'testing' ) {
  window.onload = ()=> {
    setTimeout( ()=> {
      const app = createApp(appOptions);
      app.mount("app");
    }, 0 );
  };
}

I read the docs that should register a component using code like this(seems it createdApp in the component, not the initial way):

export default {
  setup() {
    onMounted(() => {
      const myNewComponent = defineComponent({
        extends: Test,
      });
      const app1 = createApp(myNewComponent);

      nextTick(() => {
        app1.use(ElementPlus);
        app1.mount('#popup-content');
      });
    });
  },
}

my question is: should I added all needed component in the fisrt time created app? should I add the component in the sub component? if I could added component in the sub component like the simple demo, how to add using the createApp way(just createApp in the component setup like this demo)? If I created an app in the sub componnet, what is the relationship of the root app?