PMTiles icon indicating copy to clipboard operation
PMTiles copied to clipboard

How to use TypeScript types for "ol-pmtiles" ?

Open jsolly opened this issue 1 year ago • 2 comments

Context

I am attempting to use PMTiles in a TypeScript OpenLayers project with strict typing.

import { PMTilesVectorSource } from 'ol-pmtiles'

I have run into this error before and it is usually resolved by running something like, npm i --save-dev @types/ol-pmtiles. Unfortunately, that npm package does not exist.

What are my option for resolving this error? My editor is suggesting I could declare them in a .d.ts file and I could always ignore the error with an inline override.

Steps to reproduce

1 - npm install ol-pmtiles 2 - Observe linting error:

Could not find a declaration file for module 'ol-pmtiles'. '/Users/johnsolly/code/ces-collab/node_modules/ol-pmtiles/src/index.js' implicitly has an 'any' type. Try npm i --save-dev @types/ol-pmtiles if it exists or add a new declaration (.d.ts) file containing declare module 'ol-pmtiles';ts(7016)

jsolly avatar Dec 23 '23 12:12 jsolly

There isn't any TypeScript types on this module yet: https://github.com/protomaps/PMTiles/blob/main/openlayers/src/index.js because we don't have a want to transpile it into the scrip-includes (no-build-step) module. I would use ts-ignore for now.

bdon avatar Dec 25 '23 03:12 bdon

Understood! Thank you for getting back to me. I will carry on! I added the following lines to appease my IDE if anyone else is running into this issue.

// @ts-expect-error
import { PMTilesVectorSource } from 'ol-pmtiles'

  const layers = layersToFetch.map(({ filePath, title }) => {
    const layer = new VectorTile({
      declutter: true,
      // eslint-disable-next-line ts/no-unsafe-assignment, ts/no-unsafe-call
      source: new PMTilesVectorSource({
        url: `${bucketUrl}${filePath}`,
        attributions: ['© Your Data Source Attribution'],
      }),
    })
    layer.set('title', title)
    return layer
  })

I am using https://github.com/antfu/eslint-config, which abbreviates inline rule overrides.

jsolly avatar Dec 26 '23 11:12 jsolly

ol-pmtiles 1.0.0 is now in TypeScript with ESM and CJS builds. Please try it out when you can.

bdon avatar Sep 11 '24 08:09 bdon

Thanks! I am no longer working on the project where this was used. @cunningryan might be interested in this fix.

jsolly avatar Sep 19 '24 00:09 jsolly