title: Nuxt: Include 3rd party library in Vue Page component
body: <p>Imagine you want to include a 3rd party js library (eg Three.js) in a Vue page, via Nuxt.</p>
  
  <p>Local sources in the head section of either <code>nuxt.config.js</code> or <code>YourPage.vue</code> do not work:</p>
  
  <pre><code>  head: {
      script: [
        { src: '~assets/lib/three.min.js' }
      ]
    }
  </code></pre>
  
  <p>The above just results in a <code>404 http://yoursite/~assets/lib/three.min.js NOT FOUND</code>.</p>
  
  <p>In your page component, you <strong>can</strong> specify a remote src:</p>
  
  <pre><code>  head: {
      script: [
        { src: 'https://cdnjs.cloudflare.com/ajax/libs/three.js/85/three.min.js' }
      ]
    }
  </code></pre>
  
  <p>But there's seemingly no way to control <code>async / defer</code> - so there's no guarantee your external script has loaded before your page or child-components try to use it (hint: it almost certainly hasn't loaded in time).</p>
  
  <p>This seems to leave just the option of specifying a remote source in the head section of your <code>nuxt.config.js</code>. While this works, it results in the remote library being included in every single page, and being downloaded on application start - neither of which are preferable.</p>
  
  <p>What options are there for loading external libraries "per page" or more efficiently deferring load?</p>