vue is not a constructor function type

[kdheepak]

Hi, I'm getting an error when I try to use this in my Vue 3 project. The error is in the description section of this issue.

Are you sure this multiselect component works in Vue 3? From this blog post (https://labs.thisdot.co/blog/your-first-vue-3-app-using-typescript), it appears something like this might be necessary in a shim-vue.d.ts file:

declare module "*.vue" {
  import { defineComponent } from "vue";
  const component: ReturnType<typeof defineComponent>;
  export default component;
}

I'm new to Vue so I'm not really sure what is going on here.

Version

• Vue version: 3

Description

node_modules/@vueform/multiselect/src/Multiselect.d.ts:3:35 - error TS2507: Type 'typeof import("{myproject}/node_modules/vue/dist/vue")' is not a constructor function type.

3 declare class Multiselect extends Vue {
                                    ~~~

Demo

I'm unable to use the JSFiddle template to reproduce the bug because I don't know how to get multiselect installed in that template.

[kdheepak]

I'm not sure where the problem is exactly but removing vue-tsc --noEmit && from the npm run build script doesn't cause this issue anymore.

────┐
13: │
────┘
 12 ⋮ 13 │    "vue-tsc": "^0.0.24"
 13 ⋮ 14 │  },
 14 ⋮ 15 │  "scripts": {
-15 ⋮    │    "build": "vue-tsc --noEmit && vite build",
+   ⋮ 16 │    "build": "vite build",
 16 ⋮ 17 │    "dev": "vite",
 17 ⋮ 18 │    "serve": "vite preview"
 18 ⋮ 19 │  },

[daniele-bolla]

I am having the same problem. Could it be reopened?
Removing vue-tsc --noEmit && is not a real fix.

[cyberillithid]

In case if you're wondering: vue-tsc could be satisfied with an edit of first lines of Multiselect.d.ts to the following effect:

import Vue, { VNode, defineComponent } from 'vue';

declare class Multiselect implements ReturnType<typeof defineComponent> {
// ... 

Since I have no idea how that would affect Vue 2 support, that's probably not something worth a pull-request, though.

[otezz]

Hi @adamberecz, could you please take a look at solution from @cyberillithid?

I can't build my project and removing vue-tsc is not an option

[dadebue]

@otezz I had the same problem while using the multiselect in my Typescript Vue3 project. Removing vue-tsc --noEmit && was not an option.
So I forked the repo and added the solution from @cyberillithid.

At first the build was not possible because of node-sass. So I switched to sass and now everything is working...

@adamberecz would that be a possibility for your repo aswell?