typescript - Vad orsakar detta "Uncaught TypeError: Cannot read properties of undefined (reading 'provides')" när man uppgraderar ett projekt från Vuetify 2.x till 3.x?

Jag håller på att uppgradera ett projekt som är Vue 2.6.x och använder Vuetify 2.x för dess användargränssnitt. Jag har arbetat mig igenom ett antal svårigheter men har inte kunnat lösa detta.

Jag använder @vue/compat för att använda Vue 3 i kompatibilitetsläge för 2.x.

Jag kör npm run serve och det ger inga fel, men när jag laddar appen i webbläsaren visas ingenting. När jag tittar på webbläsarkonsolen kan jag se att det kastas detta fel:

Uncaught TypeError: Cannot read properties of undefined (reading 'provides') 
    at Object.install (theme.mjs:189:1) 
    at Object.install (framework.mjs:43:1) 
    at Vue.use (vue.runtime.esm-bundler.js:7224:1)
    at eval (main.ts:28:1)
    at ./src/main.ts (app.js:349:1)
    at __webpack_require__ (app.js:2942:33)
    at app.js:4083:96
    at __webpack_require__.O (app.js:3001:23)
    at app.js:4084:53
    at app.js:4086:12
 install    @   theme.mjs:189
 install    @   framework.mjs:43
 Vue.use    @   vue.runtime.esm-bundler.js:7224
 eval   @   main.ts:28
 ./src/main.ts  @   app.js:349
 __webpack_require__    @   app.js:2942
 (anonymous)    @   app.js:4083
 __webpack_require__.O  @   app.js:3001
 (anonymous)    @   app.js:4084
 (anonymous)    @   app.js:4086

Man kan se att det har problem i main.ts på rad 28:

Vue.use(vuetify);

Här är lite omgivande kontext för att hjälpa till (eller om du är riktigt äventyrlig kan du få det senaste från grenen som finns här: https://github.com/davidshq/miqa/tree/support-multiple-proxy-managers-3-3):

// main.ts
import Vue from 'vue';
import { createVuetify } from 'vuetify';
import * as components from 'vuetify/components';
import * as directives from 'vuetify/directives';

import App from '/App.vue';
import router from './router';
import { store } from './store';

const vuetify = createVuetify( {
  components,
  directives,
});

Vue.use(vuetify);
Vue.use(store);
Vue.use(snackbarService(vuetify));
Vue.use(promptService(vuetify));

Vue.config.productionTip = true;

(async () => {
 // Do some API calls
 // ...

 new Vue({
  vuetify,
  router,
  store,
  render: (h) => h(App),
})
 .$mount('#app')
 .$snackbarAttach();
 .$promptAttach();
})();

Jag har försökt lämna så mycket som möjligt i 2.x-format så att jag kan fokusera på att få Vuetify att fungera och sedan slutföra migreringen till 3.x.

Vuetify-relaterade plugins i package.json inkluderar följande:

"dependencies": {
 "@vue/compat": "^3.2.47",
 "vuetify": "^3.1.4",
 "vue": "^3.2.47",
 "vue-router": "^3.4.3",
 "vuex": "^4.1.0"
},
"devDependencies": {
 "eslint-plugin-vuetify": "^2.0.0-beta.2",
 "webpack": "^5.75.0",
 "webpack-plugin-vuetify": "^2.0.1"
}

Alla förslag uppskattas!