Skip to content

Not supported for Vue3 with TypeScript (error at build time) #260

@pommedepain

Description

@pommedepain

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch @vueform/multiselect@2.5.2 for the project I'm working on.

I was having errors at build time Type 'typeof import("blabla")' is not a constructor function type..
Seems to be a recurring problem for persons using Vue 3 (I saw the issues 142 and 58 and 83).

Here is the diff that solved my problem:

diff --git a/node_modules/@vueform/multiselect/src/Multiselect.d.ts b/node_modules/@vueform/multiselect/src/Multiselect.d.ts index 2e0c94d..ae54c4b 100644 --- a/node_modules/@vueform/multiselect/src/Multiselect.d.ts +++ b/node_modules/@vueform/multiselect/src/Multiselect.d.ts @@ -1,15 +1,15 @@ -import Vue,{ VNode } from 'vue'; +import { VNode, defineComponent } from "vue"; -declare class Multiselect extends Vue { +declare class Multiselect implements ReturnType<typeof defineComponent> { modelValue?: any; value?: any; - mode: 'single'|'multiple'|'tags'; + mode: "single" | "multiple" | "tags"; options?: any[]; searchable?: boolean; valueProp?: string; trackBy?: string; label?: string; - placeholder?: string|null; + placeholder?: string | null; multipleLabel?: any; // Function disabled?: boolean; max?: number; @@ -17,7 +17,7 @@ declare class Multiselect extends Vue { loading?: boolean; id?: string; caret?: boolean; - maxHeight?: string|number; + maxHeight?: string | number; noOptionsText?: string; noResultsText?: string; canDeselect?: boolean; @@ -38,18 +38,18 @@ declare class Multiselect extends Vue { showOptions?: boolean; object?: boolean; required?: boolean; - openDirection?: 'top'|'bottom'; + openDirection?: "top" | "bottom"; nativeSupport?: boolean; classes?: object; strict?: boolean; closeOnSelect?: boolean; autocomplete?: string; - groups?: boolean; - groupLabel?: string; - groupOptions?: string; - groupHideEmpty?: boolean; - groupSelect?: boolean; - inputType?: string; + groups: boolean; + groupLabel: string; + groupOptions: string; + groupHideEmpty: boolean; + groupSelect: boolean; + inputType: string; attrs?: object; onCreate?: Function; searchStart?: boolean; @@ -58,19 +58,19 @@ declare class Multiselect extends Vue { rtl?: boolean; infinite?: boolean; - $emit(eventName: 'change', e: {originalEvent: Event, value: any}): this; - $emit(eventName: 'select', e: {originalEvent: Event, value: any, option: any}): this; - $emit(eventName: 'deselect', e: {originalEvent: Event, value: any, option: any}): this; - $emit(eventName: 'remove', e: {originalEvent: Event, value: any, option: any}): this; - $emit(eventName: 'search-change', e: {originalEvent: Event, query: string}): this; - $emit(eventName: 'tag', e: {originalEvent: Event, query: string}): this; - $emit(eventName: 'option', e: {originalEvent: Event, query: string}): this; - $emit(eventName: 'paste', e: {originalEvent: Event}): this; - $emit(eventName: 'keydown', e: {originalEvent: Event}): this; - $emit(eventName: 'keyup', e: {originalEvent: Event}): this; - $emit(eventName: 'open'): this; - $emit(eventName: 'close'): this; - $emit(eventName: 'clear'): this; + $emit(eventName: "change", e: { originalEvent: Event; value: any }): this; +$emit(eventName: "select", e: { originalEvent: Event; value: any; option: any }): this; +$emit(eventName: "deselect", e: { originalEvent: Event; value: any; option: any }): this; +$emit(eventName: "remove", e: { originalEvent: Event; value: any; option: any }): this; +$emit(eventName: "search-change", e: { originalEvent: Event; query: string }): this; +$emit(eventName: "tag", e: { originalEvent: Event; query: string }): this; +$emit(eventName: "option", e: { originalEvent: Event; query: string }): this; +$emit(eventName: "paste", e: { originalEvent: Event }): this; +$emit(eventName: "open"): this; +$emit(eventName: "close"): this; +$emit(eventName: "clear"): this; + $emit(eventName: "keydown", e: { originalEvent: Event }): this; + $emit(eventName: "keyup", e: { originalEvent: Event }): this; $slots: { placeholder: VNode[];

This issue body was partially generated by patch-package.

Metadata

Metadata

Assignees

No one assigned

    Labels

    tsTypescript related issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions