vue-filepond icon indicating copy to clipboard operation
vue-filepond copied to clipboard

Found 2 errors: typeof is not a constructor function type (Vue 3 + vue-tsc)

Open natemate90 opened this issue 2 years ago • 5 comments

Describe the bug Getting the following error on build vue-tsc --noEmit

node_modules/vue-filepond/types/index.d.ts:26:43 - error TS2507: Type 'typeof import("d:/Project/src/App/node_modules/vue/dist/vue")' is not a constructor function type.

26 export class VueFilePondComponent extends VueConstructor<VueFilePondInstanceMethods>{ }
                                             ~~~~~~~~~~~~~~

node_modules/vue-filepond/types/index.d.ts:28:106 - error TS2344: Type 'VueFilepondProps' does not satisfy the constraint 'ComputedOptions'.
  Property 'required' is incompatible with index signature.
    Type 'boolean' is not assignable to type 'ComputedGetter<any> | WritableComputedOptions<any>'.

28 declare const VueFilePond: (...plugins: any[]) => ComponentOptions<any, VueFilePondInstanceMethods, any, VueFilepondProps>

Logs No logs available except above error message.

To Reproduce vue-tsc --noEmit

Expected behavior It should not generate any errors.

Information about your project:

    "filepond": "^4.29.1",
    "filepond-plugin-file-validate-type": "^1.2.6",
    "vue": "^3.2.2",
    "vue-tsc": "^0.3.0",
    "vue-filepond": "^7.0.0",
    "typescript": "^4.3.5"

natemate90 avatar Sep 28 '21 11:09 natemate90

Thanks for reporting. Looking into it as soon as possible, in the mean time, if you have any suggestions I'm all ears. : )

rikschennink avatar Sep 29 '21 13:09 rikschennink

It might be a vue-tsc specific problem or a general problem, I don't know at this point. Anyways, I'm doing a temporary workaround now; I'll basically disabled vue-filepond's type declaration file by declaring a module in file Project/src/node_modules/vue-filepond/index.d.ts:

declare module 'vue-filepond'

inside my Fileupload.vue component, I'm importing it then like this:

import { Component } from 'vue'
import vueFilePond from 'vue-filepond'

import FilePondPluginFileValidateType from 'filepond-plugin-file-validate-type'
import FilePondPluginFileValidateSize from 'filepond-plugin-file-validate-size'

const FilepondComponent = vueFilePond(
  FilePondPluginFileValidateType,
  FilePondPluginFileValidateSize
) as Component

I'd still prefer a typed solution but the problem is less urgent now.

Thanks @rikschennink for your work

natemate90 avatar Oct 06 '21 11:10 natemate90

@natemate90 Glad to hear you found a workaround. Tried to find a solution but wasn't successful, I'll look into it further when I have some time.

If anyone else has an idea I'm all ears : )

rikschennink avatar Oct 08 '21 07:10 rikschennink

as Component
CleanShot 2021-12-10 at 18 18 26@2x some :/

productdevbook avatar Dec 10 '21 15:12 productdevbook

Set "skipLibCkeck": true in tsconfig.json also is a workaround.

JuliusSettili avatar Jun 05 '22 18:06 JuliusSettili