A lightweight Promise-returning helper for loading the Google Maps JavaScript API
- The Promise’s fulfilled callback is passed the 
google.mapsobject - Optionally set a timeout, an API key, the language, and more
 
const loadGoogleMapsApi = require('load-google-maps-api')
loadGoogleMapsApi().then(function (googleMaps) {
  new googleMaps.Map(document.querySelector('.map'), {
    center: {
      lat: 40.7484405,
      lng: -73.9944191
    },
    zoom: 12
  })
}).catch(function (error) {
  console.error(error)
})N.B. Just like the Google Maps API itself, this module is client-side only.
Without this module, you would need to specify a named global callback, and pass said callback’s name as a parameter in the script tag’s src. For example:
<script>
window.googleMapsOnLoad = function () {
  // `window.google.maps` available here
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=googleMapsOnLoad"></script>This module abstracts this ceremony away, and fits better with modern bundlers like Browserify or Webpack.
const loadGoogleMapsApi = require('load-google-maps-api')Returns a Promise.
- Fulfilled if loading was successful. The fulfilled callback is passed the 
google.mapsobject. IfloadGoogleMapsApiis called multiple times on a page, the fulfilled callback will be passed the previously-loadedgoogle.mapsobject. - Rejected if we weren’t able to load the Google Maps API after 
options.timeout. 
See Usage.
options is an optional object literal:
| Key | Description | Default | 
|---|---|---|
apiUrl | 
The Google Maps API script tag URL | 
'https://maps.googleapis.com/maps/api/js' | 
channel | 
Client usage reporting channel | undefined | 
client | 
Client ID | undefined | 
key | 
Your API key | undefined | 
language | 
Language | undefined | 
libraries | 
Supplemental libraries to load | [] | 
region | 
Region | undefined | 
timeout | 
Time in milliseconds before rejecting the Promise | 10000 | 
v | 
API version | undefined | 
$ yarn add load-google-maps-api