VisualStudioやAtomを使用する事で、コード記述の生産性が上がりそうなのでTypeScriptをはじめてみました。
環境の構築自体は、node.jsを導入してからnpm install -g typescript とするだけです。
導入されるとtscコマンドが使用できる様になるので、tsc scriptfile.ts でbuild出来るようになります。
Atom用のコードハイライトを導入
自分はAtomを使用しているのでatom-typescriptを導入してみました。
インストールすると、
- コードハイライト
- オートコンプリート
- セーブ時に自動的にbuild
- build失敗時のエラーを表示
といったものが組み込まれます。
■
早速使ってみる
TypeScriptはjavascriptの言語仕様を拡張しているようなので、現状のjavascriptをそのまま移植してから徐々にTypeScript化して行くことが可能…なのですが、手始めに移植をしてみたcirclecheckでは、外部のjavascriptを使用している場所で問題が発生しました。
circlecheck.ts(18,26): error TS2304: Cannot find name 'Hogan'. circlecheck.ts(18,40): error TS2304: Cannot find name '$'.
こんな感じでエラーに…
正攻法としては、それぞれのライブラリ用に定義ファイルを用意するのが良いのですが、TypeScriptのハンドブックを見ながらとりあえずエラーが起こらない様な定義を作成してみました。
// ---------------------------------------------------------------- declare(s) declare module Ihogan { export interface hogan { compile; } } declare var Hogan: Ihogan.hogan; declare module Ijquery { export interface jquery { (o); getJSON; } } declare var $: Ijquery.jquery;
エラーは出なくなったけど、なんとなく適当すぎな気がしてます。
というわけで、circlecheckのjavascript部分をhtmlから分離してみました。まだ分離しただけでTypeScriptの恩恵はあまり受けていませんが…