title: Add vanilla-tilt.js to angular 6 component (external js library in angular component)
body: <p>Hello I would like to use a third party js library called vanilla-tilt.js in one of my angular components. Here is the link to the library:</p>
  
  <p><a href="https://micku7zu.github.io/vanilla-tilt.js/" rel="nofollow noreferrer">https://micku7zu.github.io/vanilla-tilt.js/</a></p>
  
  <p>What Ive done so far is: Installed with npm and linked it into my angular.json file like so:</p>
  
  <pre><code>"scripts": [
      "node_modules/vanilla-tilt/dist/vanilla-tilt.js"
  ]
  </code></pre>
  
  <p>Then in my component.ts I did the following (im only supplying the necessary code and <code>'.about-pic'</code> is the <code>&lt;img&gt;</code> I am selecting in my html file):</p>
  
  <pre><code>import { VanillaTilt } from 'vanilla-tilt/dist/vanilla-tilt.js';
  
  export class AboutComponent implements OnInit, AfterViewInit {
    ngAfterViewInit() {
      VanillaTilt.init(document.querySelector('.about-pic'), {
        max: 25,
        speed: 400
      });
    }
  }
  </code></pre>
  
  <p>I got the code in <code>ngAfterViewInit()</code> from the website I linked above, under "JS Way"</p>
  
  <p>I thought I imported this external library correctly, but I am getting the following error in the console:</p>
  
  <p><code>ERROR TypeError: Cannot read property 'init' of undefined</code></p>
  
  <p>I guess am not quite understanding the concept of installing third party js libraries in angular components.</p>
  
  <p>Can anyone help?</p>
  
  <p>Thanks!</p>