npmから外部モジュールやライブラリをインストールしているプログラマーの皆さん、こんにちわ!どうも、はこです。
Angular2などで書いてると、なんとなく型定義ファイルを使ったり、ライブラリ側が用意してくれている(xxx.jsと同じ階層にxxx.d.tsがいる)等ありますが、jsしかないライブラリを使う機会も多いですよね!
さて、そういうときに既存の型定義ファイルを使うと便利です。
・・・が、型定義ファイルの書き方は歴史的経緯で混沌としています。
時代に沿わない古いやり方
これらの方法は、TypeScript 2.0 以降は動きません。
非推奨:TSD
管理ツール導入
npm install tsd -g
インストール
tsd install jquery --save
使用方法
/// <reference path="../typings/jquery.d.ts" />
非推奨:typings
管理ツール導入
npm i --global typings
インストール
typings install dt~jquery --global --save
使用方法
/// <reference path="../typings/tsd.d.ts" />
時代にマッチする推奨のやり方
TypeScript2.0 以降は、このやり方です。
管理ツール導入は不要です!
インストール
npm install -D @types/jquery
使用方法
import * as $ from 'jquery'
npmさえあれば、簡単に使えますね!
…もしも、あなたが探しているjsライブラリの型定義ファイルが
npm install -D @types/ライブラリ名
で見つからないようであれば、 @
を抜いた npm install -D types/ライブラリ名
を試してみてください。
( @
を抜くと、 DT管理の型定義ファイルでなく、 github/types が作った型定義ファイルを参照するようになります。)
余談:
DefinitelyTypedとMicrosoft-TyoesPublisherとtypesリポジトリ
DefinitelyTyped (通称DT)
は非営利組織で、型定義ファイルの管理をしている団体。
Microsoft-TyoesPublisher
は営利組織 Microsoft inc. の管理するBOTで、たぶん非営利部門で、npmの@typesの管理者であり、
types リポジトリは、npm上でホストされる npmの@types との違いは
- npm上にないこと(単なるgitリポジトリ)
- @typesに載ってないライブラリが存在するので便利
- 運営主体が誰なのかよくわからない
TypeScript型定義の雑な歴史
tsd : コメントで頑張って読む方式。DefinitelyTyped(DT)という組織が立ち上がり、様々なライブラリの型定義を登録。くそでかいリポジトリをpullする必要があった。
↓
typings: とりあえずnpm上からも取れるし、DTからでも取れるようにした。
だが、基本的にはDTのまま。コメント定義で頑張って読む。非DTになりたい。
↓
@types : 言語開発者(=Microsoft)が外部ライブラリをきちんと対応するために大議論。「npmでいれたい!」という主張にあわせ言語側の対応も再構築。
DTでホストしていた型定義をnpmに登録(BOTで)。
npm経由で入れることで
- package.jsonに定義がすべて統合される。typings.jsonのような依存性管理ファイルが不要に。
- tsd/typingsと違い、DTの巨大リポジトリをpullする必要がなくて早い
- 社外に出せないライブラリも
node_modules/@types/
以下に保存されるように package.jsonで型定義作ればいいので簡単
とかの利点が得られるようになった。
ついでに言語側の方も対応したので、 /// <reference path="..
ではなく import {ClassName} from 'Modules/ModuleName'
と参照すれば型情報を取り込むようになった。
言語として完成された感ある・・・というか
すごく楽!!!
完全な余談
D!T! D!T! DT捨テル!