TypeScript type definitions (typings)

In TypeScript, most of the time, we also need to install type definitions (also called typings) separately for the JavaScript libraries that we use. Type definitions are files used by the TypeScript compiler to help us out while coding and compiling. They contain all the information about types that are used in a library: interfaces, classes, module declarations, custom types, and more.

When the TypeScript compiler finds type definition files, they're included in the compilation scope and the definitions are ambient. You can learn more about that here: https://medium.com/@mikenorth/guide-to-typescript-ambient-declarations-717ef6da6514.

Without type definitions, the TypeScript compiler wouldn't know much about the types used in third-party JavaScript libraries that you may want to use. Without that information, TypeScript loses a lot of its appeal because you have to rely on the any keyword everywhere.

Type definitions are stored in .d.ts files. They are only needed for JavaScript libraries but, of course, as soon you transpile TypeScript code to JavaScript, all the type information is lost.

For TypeScript-based projects, generating type definition files is very easy: you only need to set the declaration compiler option to true in the tsconfig.json file (or enable it by passing the --declaration argument directly when invoking tsc). Go ahead and change that option now for MediaMan. If you build the application after that, you'll see that TypeScript generates an additional mediaman.d.ts file for you, containing all the type information.

As you know, there are hundreds of thousands of JavaScript libraries and, of course, only a small subset of those libraries are written in TypeScript. For all the other ones, type definitions have to be created by hand or using other tools such as dts-gen: https://github.com/Microsoft/dts-gen.

As the TypeScript community grew, the need to centralize type definition files arose and, at some point, a project called DefinitelyTyped (http://definitelytyped.org) was created to regroup as many type definitions as possible. Today, DefinitelyTyped hosts type definitions for thousands of libraries.

Initially, installing type definitions in your project required manual work, but nowadays it has become very straightforward. The TypeScript team has automated the process of creating npm packages out of the type definitions hosted on DefinitelyTyped. Thanks to this, you can simply use npm to install type definitions, knowing that the following naming convention is used for typings: @types/<library_name> (@types being the name of the namespace under which all type definition packages are published).

For example, type definitions for the very popular lodash (https://github.com/lodash/lodash) library are available at https://www.npmjs.com/package/@types/lodash and can be installed easily using npm install @types/lodash.

Sometimes, you might need to create type definitions by hand, for example, if no typings exist for a library or if they are outdated/broken. When doing so, you'll need to use triple-slash directives to load them: https://www.typescriptlang.org/docs/handbook/triple-slash-directives.html.

Whenever you add a library to your projects, check whether the typings are provided along with the library, or whether they are on DefinitelyTyped and accessible through @types/<library_name>.

In the compiler configuration, you can customize locations where TypeScript will look for type definitions using the typeRoots option. You can learn more about it here: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#types-typeroots-and-types.

You can learn more about type definitions here:

• https://blog.angular-university.io/typescript-2-type-system-how-do-type-definitions-work-in-npm-when-to-use-types-and-why-what-are-compiler-opt-in-types
• https://basarat.gitbooks.io/typescript/docs/types/@types.html