Typescriptの型定義ファイルとは

はじめに

現在、Vue.jsのおさらいをしているのですが、ここでは型定義ファイルについて記述していこうと思います

何のためのものか

型定義ファイルとは、型のないJavascriptのライブラリーをTypeScriptで使えるようにするためのファイルです。
Typescriptの特徴は「静的型付け」ができることですが、型の無いJavasciriptライブラリで型を利用するには「どの変数が何の型なのか」を定義したファイルが必要になります。
拡張子は「.d.ts」です。

型定義ファイルの中身

※以下サイトからソースを参照しています。
サバイバルTypeScript

例えば以下のようなjsファイルがあったとします。
sample.js

function greeter(person) {
  return "Hello, " + person.firstName + " " + person.lastName;
}

これを型定義ファイルに記載すると。
sample.d.ts

interface Person {
  firstName: string;
  lastName: string;
}
declare function greeter(person: Person): string;

こんな感じになります。

型定義ファイルのinstall

よく使われるライブラリには、あらかじめ型定義ファイルが用意されているので、先ほどのように自作する必要はありません。
例えば「lodash」ですが、以下コマンドでinstallしたとします。

npm install –save lodash

ですがこのままではエラーが出てしまいます。
そこで以下コマンドで型定義ファイルのinstallができます。

npm install –save @types/lodash

型定義ファイルは、通常のinstall時に含まれる場合もあるので、その場合は不要になります。