title: Module Not Found error in Vue.js single page component using google maps
body: <p>I'm attempting to pull in a Google Map from the Google Maps API into my Vue.js application.  I have retrieved my generated API key and I am trying to display the map.  When I run the app, Atom throws a Module not found error message and the browser displays: <code>Can't resolve 'https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&amp;callback=initMap' in 'C:\Atom Projects\Project\client\src\components'</code> Any idea what I'm doing wrong? </p>
  
  <p><strong>MyComponent.vue</strong></p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;    
    &lt;div id="map"&gt;
    &lt;/div&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
    function initMap () {
      var options = {
        zoom: 8,
        center:{lat:39.9612,lng:-82.9988}
      }
  
      var map = new google.maps.Map(document.getElementById('map'), options);
    }
  &lt;/script&gt;
  
  &lt;script async defer type="text/javascript"
          src="https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&amp;callback=initMap"&gt;
  &lt;/script&gt;
  
  &lt;style&gt;
    #map{
      height: 400px;
      width: 100%;
    }
  &lt;/style&gt;
  </code></pre>
  
  <p><strong>Full Error from Browser</strong></p>
  
  <pre><code>./src/components/MyComponent.vue
  Module not found: Error: Can't resolve 'https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&amp;callback=initMap' in 'C:\Atom Projects\MyProject\client\src\components'
   @ ./src/components/MyComponent.vue 8:0-131 9:0-144
   @ ./src/router/index.js
   @ ./src/main.js
   @ multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js
  </code></pre>