Is there any package available on npm for google maps? Or am I really
supposed to paste this
<script src=https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY>
</script>
to my index.html and download this js file on every refresh?
This is super annoying, because sometimes I get ReferenceError: google is not defined.
Or am I really supposed to paste this
to my index.html and download this js file on every refresh?
Yes. This is the only way to do so. There are some packages to dynamically do this for you, but the behavior is the same.
To reiterate, there is no official package for loading the Google Maps JavaScript for the web environment on NPM. The @google/maps referenced by others is for node only.
google is not defined errors can be avoided by using the callback query parameter when loading the google maps script.
Update - 2020/01/17
I wrote @googlemaps/js-api-loader to help load the script dynamically and support promises.
import { Loader } from '@googlemaps/js-api-loader';
const loader = new Loader({
apiKey: "",
version: "weekly",
libraries: []
});
loader
.load()
.then(() => {
new google.maps.Map(div, mapOptions);
})
.catch(e => {
// do something
});
