TypeScriptでChrome拡張を書くテンプレートリポジトリを作った

去年の7月からお世話になっている京都のIT系学生コミュニティCAMPHOR- にて,『漸進的型付けを語る会』という素晴らしい催しがありまして,そこでTypeScriptの概要を発表しました.イベント自体については,そのうち公式ブログ http://blog.camph.net/ にレポート記事が上がりますので,興味のある方は見てみてください.

今回の調査に乗じて,拙作のHoogleSwitcherをTypeScriptで書きなおしたのですが,ビルド環境が割と良い感じになったのでテンプレートにして公開しました!このまま使えなくとも,各種設定ファイルくらいは参考になると思うので良しなに使ってください.以下では関係ツールを黙々と紹介します.

github.com

gulp

JS界隈ではおなじみのビルドツール.他の様々なビルドツールAPIをストリームとして組み合わせて処理を記述します.学習コストは高めですが強力なツールです.今回のテンプレートでは主に以下の操作を記述しています.

  • gulp watch
  • gulp test
    • ビルド(型検査)とLint
  • gulp pack
    • ビルドして公開用のzipファイルを生成する

webpack

最近注目を集めている(?)フロントコードのビルドツールです.browserifyと同系列のツールだと思えば大体合っているのではないでしょうか..tsファイルの変換を行うように設定し,gulpから使用しています.

typings

TypeScriptの型定義ファイルを管理するツールです.既存のライブラリを含めた型検査を行う場合に別で用意された型定義ファイルをダウンロードして読み込む必要があり,それらの一覧や設定を管理してくれます.