swiper/vue missing type declarations

[honzabilek4]

This is a (multiple allowed):

• bug
• enhancement
• feature-discussion (RFC)

I see that Swiper has already types for swiper/react component included. I would be really cool to add type definitions for swiper/vue component as well. This would allow us to integrate swiper in vue.js projects with typescript easier.

I'm willing to work on this feature with a little guidance from maintainers.

• Swiper Version: v3.6.5
• Platform/Target and Browser Versions: Typescript

[GerryWilko]

If this helps anyone I wrote a skeleton typings file to get it to atleast work with a typescript vue project:

swiper-t.d.ts

declare module 'swiper/vue' {
  import _Vue from 'vue';

  export class Swiper extends _Vue {}

  export class SwiperSlide extends _Vue {}
}

[vltansky]

@GerryWilko you're welcome to contribute :)

[GerryWilko]

@vltansky Apologies I meant to come back to this and create a PR. I just dropped this in as a comment temporarily. I'll raise a PR tomorrow! 😀

[GerryWilko]

I've raised a PR for this file. I did a bit of testing and it didn't seem to affect the React typings.

[NabilFr]

In the meantime, how we can use swiper in vue 3/typescript project?

[david50407]

@NabilFr use this shim:

declare module 'swiper/vue' {
  import { DefineComponent } from 'vue'

  export const Swiper: DefineComponent<any, any, any>
  export const SwiperSlide: DefineComponent<any, any, any>
}

[giuliano-macedo]

@david50407 I think you should make a PR with this shim 👀

[david50407]

@giuliano-oliveira this shim only provides simple definition of swiper/vue module without details (like props, slots, etc)
IMO, this shim is a workaround, this project still need full type definitions for Vue.

[nicojmb]

Please, add full typscript support on vue in future releases.

[heyhippari]

The proper (i.e. more maintainable) way to do this would probably be to convert the component to TypeScript.

Having separate, manually written typings is a recipe for disaster in the long run, imo.

I'd be willing to work on the conversion, if the maintainers are okay with it. I'll do some preliminary exploration on my end, based on how the Angular component builds itself, and report back once I have something.