LoginSignup
12
13

More than 5 years have passed since last update.

typescriptの定義ファイルd-tsを実際にdefinitelytypedにpullrequestしてみた

Last updated at Posted at 2014-12-20

元記事はこちら

これから定義ファイルを作成してみたい!という人は必ずこちらの記事を読みましょう。ここから下はあくまで実際に実践してみた過程を備忘録代わりに載せているだけです。

ツッコミや修正すべき点はコメント等いただけるととてもうれしいです

今回Typescriptで欲しかった定義ファイルは「angular-local-storage」というlocalStorageをいい感じに使わせてくれるangularjsのモジュールです。

1. 本家からFork

まずはGithubのDefinitelyTypedに行き、右上の「Fork」を押してForkしましょう
スクリーンショット 2014-12-18 21.24.50.png

2. git clone → branch作成

ForkしたリポジトリをローカルにGit Cloneしてきてまずはライブラリ名のbranchを作成しましょう(今回ならangular-local-storageブランチ)。次にライブラリ名(angular-local-storage)と一致するフォルダを作成します。
スクリーンショット 2014-12-18 21.25.45.png

3. 定義ファイルの作成

作成したフォルダに定義ファイルを作成します(angular-local-storage.d.ts)
スクリーンショット 2014-12-18 21.26.19.png

4. ヘッダ情報の設定

DefinitelyTypedに投稿する定義ファイルには以下のようにヘッダ情報を入力

// Type definitions for [ライブラリ名(バージョンがわかればバージョンも)]
// Project: [ライブラリのURL] 
// Definitions by: [作った人(自分)] <[自分のURL]> 
// Definitions: https://github.com/borisyankov/DefinitelyTyped

スクリーンショット 2014-12-18 21.34.34.png
今回はv0.1.5が対象だったのでヘッダ情報にも書いておきました。
スクリーンショット 2014-12-18 21.26.55.png

5. 定義ファイルの中身作成

さて、次のキャプチャではもう定義ファイルは概ね完成しています。作り方とかはTypeScriptの仕様とかが絡んでくる話なので割愛。これはとにかく対象となるライブラリのAPIを読みながら作っていくしかないと思います。コメントとかも概ね流用したものをそのまま定義ファイルに使っています。
スクリーンショット 2014-12-18 22.53.45.png

6. テストコード作成

定義ファイルが完成したところで次に必ず作らないといけないのが、その定義ファイルを使ったテストコードです。「ライブラリ名-tests.ts」を作りましょう(今回ならangular-local-storage-tests.ts)
スクリーンショット 2014-12-18 22.54.48.png

7. テストコードのコンパイル

本家の「Contribution guide」にもテストコードは対象のライブラリのサンプルコードとかを書いとけばいいよみたいなことが書いてあるので、とりあえずGithubのReadmeに載っているサンプルコードをTypescriptで書きました。以下でコンパイルが通れば多分OK。
tsc --noImplicitAny angular-local-storage/angular-local-storage-tests.ts
サンプルコードはこんな感じ↓
スクリーンショット 2014-12-18 23.35.32.png

8. テスト実行(npm test)

ひと通り完成したところで「npm test」を走らせてテストがちゃんと通ることを確認します。

mbp:DefinitelyTyped hoge$ npm test
> DefinitelyTyped@0.0.1 test /Users/hoge/Projects/Fork/DefinitelyTyped
> node ./_infrastructure/runner.js --changes

=============================================================================
DefinitelyTyped Diff Detector 0.1.0
=============================================================================
All changes
-----------------------------------------------------------------------------
angular-local-storage/angular-local-storage-tests.ts
angular-local-storage/angular-local-storage.d.ts
rest/rest-tests.ts
rest/rest.d.ts
-----------------------------------------------------------------------------
Removed files
-----------------------------------------------------------------------------
no files listed here
-----------------------------------------------------------------------------
Interesting files
-----------------------------------------------------------------------------
angular-local-storage/angular-local-storage-tests.ts
angular-local-storage/angular-local-storage.d.ts
rest/rest-tests.ts
rest/rest.d.ts
not mapped? -> /Users/hoge/Projects/Fork/DefinitelyTyped/when/when
-----------------------------------------------------------------------------
Queued for testing
-----------------------------------------------------------------------------
angular-local-storage/angular-local-storage-tests.ts
angular-local-storage/angular-local-storage.d.ts
rest/rest-tests.ts
rest/rest.d.ts
=============================================================================
DefinitelyTyped Test Runner 0.5.0
=============================================================================
Typescript version: 1.3.0
Typings : 2
Tests : 2
TypeScript files : 4
Total Memory : 16384 mb
Free Memory : 3650 mb
Cores : 4
Concurrent : 3
============================== Syntax checking ==============================
..
-----------------------------------------------------------------------------
Elapsed time : ~0.827 seconds (0.827s)
Successful : 100.00% (2/2)
Failure : 0.00% (0/2)
=============================== Typing tests ================================
..
-----------------------------------------------------------------------------
Elapsed time : ~0.862 seconds (0.862s)
Successful : 100.00% (2/2)
Failure : 0.00% (0/2)
=============================== Header format ===============================
..
-----------------------------------------------------------------------------
Elapsed time : ~0.002 seconds (0.002s)
Successful : 100.00% (2/2)
Failure : 0.00% (0/2)
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------
Total
-----------------------------------------------------------------------------
Elapsed time : ~2.452 seconds (2.452s)
Syntax error : 0.00% (0/2)
Failed tests : 0.00% (0/2)
Invalid header : 0.00% (0/2)
Without tests : 0.00% (0/2)
-----------------------------------------------------------------------------

9. Commit & Push

とりあえずなんとなくテストが通ってそうな予感がしたところで、Forkしたリポジトリにコミット&プッシュしちゃいます。
スクリーンショット 2014-12-18 23.41.00.png

10. Push結果確認

Pushが完了したところでGithubの自分のForkしたリポジトリを見ると以下のように「Compare & pull request」という項目が増えているのがわかります。
スクリーンショット 2014-12-18 23.42.17.png

11. Pull Requestの作成

迷わず「Compare & pull request」をクリックしてタイトルを「add ライブラリ名 definition file」みたいな感じでpull requestを作成しましょう。
スクリーンショット 2014-12-18 23.42.31.png

12. Pull Requestの確認

pull requestが完了したところで本家の「pull request」一覧を観に行くと、ちゃんとpull requestが作成されていることがわかります。右側の印はTravis CIにてビルドがちゃんと通ったかどうかを教えてくれます。アクセスするのが早過ぎると下の画面みたいに「ビルド中…」のマークがつきます。
スクリーンショット 2014-12-18 23.43.19.png

ちょっとしてからリロードするとちゃんとビルドが通っていることが確認できて一安心。後は本家にマージするのを待つだけです。
スクリーンショット 2014-12-18 23.43.26.png

13. マージ完了メールの確認

何日かしたらvvakameさんからマージ完了のメールと共に「@kenfdev(私のユーザ名) thanks mate!」 みたいなメールを受け取ることができます。

14. TSDで定義ファイルのインストール確認

上記全て完了するとTSDというTypescript Definition Managerで自分の作ったライブラリがインストールできるようになります。例えば以下のコマンドで今回の定義ファイルはインストールできます。

tsd query angular-local-storage --action install
12
13
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
13