TypeScript error when used with Vue 3

[hongquan]

I use this component in a project with Vue 3, when I build, I get this error:

❯ yarn build
yarn run v1.22.17
$ vue-tsc --noEmit && vite build --emptyOutDir
node_modules/@vueform/toggle/src/Toggle.d.ts:3:30 - error TS2507: Type 'typeof import("/home/quan/Works/AgriConnect/PlantingHouse/controlview/heomay/node_modules/vue/dist/vue")' is not a constructor function type.

3 declare class Toggle extends Vue {
                               ~~~


Found 1 error.

error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[unchewyglees]

It seems the issue is that the base Vue class is removed in Vue 3 https://github.com/vuejs/vue-class-component/issues/406

There are some workarounds with the typings error that I found worked

• Adding "skipLibCheck": true to tsconfig.json https://github.com/vueform/multiselect/issues/58
• Changing the @vueform/toggle/src/Toggle.d.ts file as per https://github.com/vueform/multiselect/issues/83, though this didn't work very easily for me
• Doing the following in @vueform/toggle/src/Toggle.d.ts: Change import Vue,{VNode} from 'vue' to import {VNode} from 'vue', and Remove extends Vue from declare class Toggle extends Vue {

[mcelligottnick]

I couldn't get this working with any of those fixes using;

• "vue": "^3.2.41",
• "typescript": "^4.8.4",

[adamberecz]

Feel free to reopen with a reproducible example if still relevant.