TypeScript: index.d.ts file?

[steklopod]

First of all, thanks for this project 👍🏻

Map is working.

But when I do type check with nuxi typecheck command I get:

    "vue-tsc": "1.6.5"

Installing these deps did not help:

{
"@types/mapbox__mapbox-gl-geocoder": "^4.7.3",
 "@types/mapbox-gl": "^2.7.11"
}

---

Solved it by adding into shims.d.ts file:

declare module '@studiometa/vue-mapbox-gl' {
    export const MapboxMap: any;
    export const MapboxMarker: any;
    export const MapboxCluster: any;
    export const MapboxGeocoder: any;
    export const MapboxGeolocateControl: any;
    export const MapboxImage: any;
    export const MapboxImages: any;
    export const MapboxLayer: any;
    export const MapboxNavigationControl: any;
    export const MapboxPopup: any;
    export const MapboxSource: any;
    export const StoreLocator: any;
}

Could index.d.ts be added to library?

[Ciriak]

+1 , this is still an issue

[steklopod]

@titouanmathis is there a chance to fix that?

[titouanmathis]

This should be easier to implement since the mapbox-gl package is now written in Typescript as well. With that said, this is not a priority on our end for now, so any PR on the subject is welcome.

[titouanmathis]

For those who want to try this out for feedback, you can install v2.7.0-alpha.0:

npm install @studiometa/vue-mapbox-gl@next

[steklopod]

@titouanmathis thanks for the fix. I tried and the problem has gone, but new appeared:

I can't use

import type { LngLatLike } from 'mapbox-gl'

const markers: LngLatLike[] = [mapCenter.value, [13.360610, 52.505995]]

        <MapboxMarker v-for="coord in markers" :key="coord" :lng-lat="coord" />

Vue: Type LngLatLike is not assignable to type unknown[] | undefined

[steklopod]

My dirty fix:

const mapCenter = ref<LngLatLike>([lng.value, lat.value])

type Coordinates = [number, number]
const markers: Coordinates[] = [[lng.value, lat.value], [13.360610, 52.505995]]

    <MapboxMarker v-for="coord in markers" :key="`${coord[0]}-${coord[1]}`" :lng-lat="coord" />

[titouanmathis]

Thanks for the feedback @steklopod. Types are generated from the props config for now, so some props might not be correctly typed.

The way to fix this should be to change how props are declared to the type only way: https://vuejs.org/api/sfc-script-setup.html#type-only-props-emit-declarations

In the meantime, you will have to use some hacks as you did.