webpack/@googlemaps/js-api-loader:

[strarsis]

When using map-label-rotated with @googlemaps/js-api-loader and building with webpack, I get an error during runtime when trying to create a rotated label:

Uncaught ReferenceError: google is not defined
    at Object.<anonymous> (make-control.js:23)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (some-js-file.js:1)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (main.js:1)
    at Object.<anonymous> (main.js:34)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (index.js:240)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at bootstrap 9ec78d170b869e843be0:62

import { RotatedLabel }  from 'map-label-rotated';
[...]
const label = new RotatedLabel( bounds.getCenter(), 'Test', 45, map );

[javidalpe]

Hey @strarsis, I have updated the class so it extends from window.google instead of google. Could you check now?

[strarsis]

@javidalpe: Awesome! Thanks for the modification. When I got some more time I will test it and give feedback.

[strarsis]

@javidalpe: So after about a year I finally got back to that project. 😮 ⏲️

The issue is that the google maps loader will set google.maps asynchronously.
I import this map-label-rotated library and it will immediately try to use the global variable for google maps,
as it extends it directly in its defintion:
export class RotatedLabel extends window.google.maps.OverlayView {

I don't know if this can be easily changed. I guess I have to asynchronously import this library.