How to use third-party typescript plugins in Angular2?

Question

I am new to angular2 but quite mature with javascript development. I used many jQuery plugins in my previous projects. I want to use them all in my new angular2 project as well.

Things which I already know:

1. I have to use typescript definitions files to use them.

But what I want to know is

1. Where to place them in angular2 project.
2. Should I use npm to download them, so that they got placed into node_modules folder.
3. Should I manually copy them in typings folder.

I tried with point 2 but was not able to take it's reference. Can any one tell me that How can I import third-party typescript plugins and import them in my angular2 components. What is best practice?

Secondly, what is the use of typings folder?

Answer 1

There are many ways to do the thing. However the modern way is using types from the node_modules folder.

In order to do that (if the library itself does not provide the types like Angular does) you need to install the typescript definition files:

npm install @types/mylibrarytoimport --save-dev

This will take the type definitions from https://github.com/DefinitelyTyped/DefinitelyTyped. Now the interesting part: how to use it in your project. According to the docs you don't need to do anything else: it just works.

Before this way became possible there was a typings library which tried to fix the problem until they realised they implement a second npm, so they just moved to the existing one. Luckily NPM added support of scoped packages which made it possible.

Before typings there was no real way to get the type definitions automatically, so everybody was forced to download and track the changes manually.