リリース直前のTypeScript 2.0をインストールして新機能を先取りする方法

Microsoft社製の人気のAltJS「TypeScript」は現在1.8系が最新バージョンですが、2.0へのメジャーアップデートを控えています。本エントリーでは、リリース前のTypeScript 2.0を安全に試す方法を紹介します。

TypeScript 2.0をインストールする

TypeScript 2.0はリリース前の為、グローバル環境にインストールすると他のプロジェクトに影響を与える可能性があります。他プロジェクトに影響を与えないよう、グローバルではなくテスト用フォルダの範囲内のみでTypeScript 2.0を使えるようにします。

任意のフォルダを作成し、npm init -yを実行しておきます。

コマンド

cd myproject
npm init -y

現在開発中のTypeScript 2系をインストールするには、次のコマンドを実行します。

コマンド

npm install --save-dev typescript@beta

--save-devを指定することで、プロジェクトフォルダ内のnode_modulesフォルダにTypeScript 2.0がインストールされます。

TypeScript 2.0コードをコンパイルする

TypeScript 2.0の動作を確かめるため、TypeScript 2.0の新機能の一つであるprivateなconstructorを使ったコードを書きます。ファイル名はhoge.tsとします。

hoge.ts(TypeScript2のコード)

class Hoge {
	private constructor() {
	}
}

TypeScript 1.8系ではこのコードをコンパイルするとエラーになります。node_modulesにインストールされたTypeScript 2.0でコードをコンパイルするには、2つの方法があります。

1. コマンドを直接指定してコンパイルする

node_modules内のTypeScript 2.0は./node_modules/.bin/tscで実行できます。

TypeScript2のコンパイル

./node_modules/.bin/tsc hoge.ts 

実行すると、hoge.tsがJavaScriptファイルhoge.jsファイルにコンパイルされます。

hoge.js

var Hoge = (function () {
    function Hoge() {
    }
    return Hoge;
}());

2. npm-scriptsを使ってコンパイルする

package.jsonファイルにシェルスクリプト（のエイリアス）を記述することで、npmモジュールを使う方法です。直接コマンドを叩くよりも完結に記述でき、かつ他のタスクとも連携しやすいので、お薦めの方法です。npm-scriptsについては、記事「Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ - ICS MEDIA」を参照ください。

以下は、compileというタスクを作成した例です。

package.json

{
  "scripts": {
    "compile": "tsc hoge.ts"
  }
}

compileを実行するには、次のコマンドを実行します。

package.json

npm run compile

compileは、コマンド./node_modules/.bin/tsc hoge.tsと同じ意味になる為、実行すると「1. コマンドを直接指定して使う」と同じようにJavaScriptファイルhoge.jsへコンパイルされます。

hoge.js

var Hoge = (function () {
    function Hoge() {
    }
    return Hoge;
}());

TypeScript 2.0を先取りしよう

TypeScript 2.0のロードマップは記事「Roadmap · Microsoft/TypeScript Wiki」より確認できます。個人的には「async/await and generators support for ES5/ES3」が楽しみです。リリースは近々と噂されていますので、TypeScript 2.0をインストールして、一足早く新機能を試してみましょう。

次のエントリーでは、TypeScript 2.0で、npmのみで型定義ファイルを管理する方法を紹介します。