I upgrade the vue to 3.x, when I run the app, shows error like this:

Uncaught TypeError: _vue2.default is not a constructor

I initial the app like this:

if ( process.env.NODE_ENV !== 'testing' ) {
  window.onload = ()=> {
    setTimeout( ()=> new Vue( appOptions ) , 0 );
  };
}

this is the full code:

import Vue from 'vue';
import template from './tpl.html';
import chromeCall from 'chrome-call';
import getOptions from '../public/default-options';
import {getTabLocation,isHostEnabled} from '../public/util';
import ST from './st';

    export const appOptions = {
      el : 'app' ,
      template ,
      data : {
        _host : null ,
        canInject : false ,
        enabled : false
      } ,
      methods : {
        async switchEnable() {
          const {_host} = this.$data ,
            enabled = this.enabled = !this.enabled ,
            {excludeDomains} = await getOptions( 'excludeDomains' );
    
          if ( enabled ) {
            excludeDomains.splice( excludeDomains.indexOf( _host ) , 1 );
          } else {
            excludeDomains.push( _host );
          }
          return chromeCall( 'storage.local.set' , { excludeDomains } );
        }
      } ,
      components : {
        'st-box' : ST
      } ,
      async ready() {
        const locationObj = await getTabLocation();
        if ( locationObj ) {
          this.$data._host = locationObj.host;
          this.canInject = true;
          this.enabled = await isHostEnabled( locationObj );
        }
      }
    };
    
    /* istanbul ignore if */
    if ( process.env.NODE_ENV !== 'testing' ) {
      window.onload = ()=> {
        setTimeout( ()=> new Vue( appOptions ) , 0 );
      };
    }

why did this happen? what should I do to fix this problem? I have tried to tweak the code like this:

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

still did not fix this problem.