title: Use 3rd party Javascript library in Vue component
body: <p>I'm using Webpack and VueJs 2. I want to use a 3rd party javascript library in my component, such as this: </p>
  
  <pre><code>&lt;script async defer src="https://apis.google.com/js/api.js" ... &gt;&lt;/script&gt;
  </code></pre>
  
  <p>I found an article <a href="https://vuejsdevelopers.com/2017/04/22/vue-js-libraries-plugins/" rel="noreferrer">here</a> about how to do this for npm packages, but that doesn't work for me since this library is not available as npm package. </p>
  
  <p>It's not possible for me to download the file locally and use it since the library might change and stop working. Therefore it has to be loaded from the link every time the page is loaded by the browser.</p>
  
  <p>I found one possible solution <a href="https://stackoverflow.com/a/47002863/448625">here</a> but that is basically a hack(modify dom to add a <code>script</code> element after document is loaded)</p>
  
  <p>I believe there must be a simple good practice solution for this issue since I assume this is a common use-case.</p>
  
  <p><strong>Update:</strong>
  If I put the script inside head tags in my index file, it would be loaded for all the components. For performance reasons, I would want it to be loaded only for a certain component.</p>