edmondchui / oms

Typescript fork of https://github.com/jawj/OverlappingMarkerSpiderfier
0 stars 0 forks source link

Replace Deprecated @types/googlemaps by @types/google.maps #1

Open edmondchui opened 3 months ago

edmondchui commented 3 months ago

References

https://www.npmjs.com/package/@types/googlemaps

edmondchui commented 3 months ago

Delete package-lock.json and then run npm install to update the NPM dependency packages.

edmondchui commented 3 months ago

Clean

$ npm run clean

> ts-overlapping-marker-spiderfier@1.0.4 clean
> rimraf ./dist

And build got this error

$ npm run build:tsc

> ts-overlapping-marker-spiderfier@1.0.4 build:tsc
> tsc

error TS2688: Cannot find type definition file for 'googlemaps'.
lib/oms.ts(406,23): error TS4073: Parameter 'marker' of public method from exported class has or is using private name 'google'.
lib/oms.ts(635,30): error TS4063: Parameter 'map' of constructor from exported class has or is using private name 'google'.

To resolve the above reference issues, add

/// <reference types="@types/google.maps" />

to the beginning of lib/oms.js file.

edmondchui commented 3 months ago

Now build again and got a new error.

$ npm run build:tsc

> ts-overlapping-marker-spiderfier@1.0.4 build:tsc
> tsc

error TS2688: Cannot find type definition file for 'googlemaps'.

The only place referencing googlemaps is in tsconfig.json

    "types": [
      "googlemaps"
    ]

Let's change it to

    "types": [
      "google.maps"
    ]

and build

$ npm run build:tsc

> ts-overlapping-marker-spiderfier@1.0.4 build:tsc
> tsc

lib/oms.ts(659,83): error TS2694: Namespace 'google.maps' has no exported member 'MouseEvent'.
node_modules/@types/google.maps/index.d.ts(3535,29): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(4520,30): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(7838,35): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(7851,32): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(7871,41): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(8273,15): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(8307,15): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(8312,15): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(11157,33): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(11260,33): error TS2304: Cannot find name 'unknown'.
node_modules/@types/google.maps/index.d.ts(11527,33): error TS2304: Cannot find name 'unknown'.
edmondchui commented 3 months ago

Per this stackoverflow post, it could due to old version of typescript (currently 2.72, latest 5.5.4).

Update typescript

npm update typescript

and build again

$ npm run build:tsc

> ts-overlapping-marker-spiderfier@1.0.4 build:tsc
> tsc

lib/oms.ts:659:83 - error TS2724: 'google.maps' has no exported member named 'MouseEvent'. Did you mean 'KmlMouseEvent'?

659         this.addListener('click', (marker: google.maps.Marker, event: google.maps.MouseEvent) => google.maps.event.trigger(marker, 'spider_click', event)); // new-style events, easier to integrate
                                                                                      ~~~~~~~~~~

Found 1 error in lib/oms.ts:659

MouseEvent is now MapMouseEvent

https://stackoverflow.com/a/71174419/1032820 https://developers.google.com/maps/documentation/javascript/reference/map#MapMouseEvent

Change MouseEvent to MapMouseEvent inside lib/oms.rs and rebuild.

edmondchui commented 3 months ago

Build succeed

$ npm run build:tsc

> ts-overlapping-marker-spiderfier@1.0.4 build:tsc
> tsc