はじめに
かなり今更感はありますが、Visual Studio Code（以下VSCode）でTypeScriptを開発してみたいので、自分で理解するためにもアウトプットしていきます。
Windows構築でVSCodeとTypeScriptを利用し、最終的にはフロントエンドフレームワークとASP.NETなどと組み合わせて簡単なWebサービスを作成するのが目標です。
対象読者
- VSCodeを使用したTypeScriptの入門
- フロントエンドフレームワークの入門（だいぶ後半になるかと）
- Webサービスの構築の入門（同じく、だいぶ後半になるかと）
インストール作業
まず、VSCodeとNode.js、TypeScriptの3つをインストールします。
Visual Studio Code
下記リンクからインストーラーをダンロードして実行。
https://code.visualstudio.com/
とくになにもなくインストール可能です。
Node.js
下記リンクからインストーラーをダンロードして実行。
https://nodejs.org/en/
PATHを通す必要がありますが、YESYESしてればインストーラーが通してくれます。
TypeScript
コマンドプロンプトからも可能ですが、せっかくなので、VSCodeからインストールします。
- VSCodeの起動。
- 『Ctrl + Shift + @』キーを押下しターミナルを起動。
- 起動したターミナルに以下のコマンドを入力。
npm install -g typescript
これで実装は可能になりますが、TypeScriptを扱ううえで必要になるツールがあるので、それらもインストールします。
tslint
tslintはTypeScript用の静的解析ツールです。
（静的解析ツールとはコードを実行せずに、検証を行ってくれるツールです。
コーディング時という早い段階でエラーを検出できるので、バグ修正のコストが減ります。）
ターミナルに以下のコマンドを入力。
npm install -g tslint
vscode-tslint
vscode-tslintはtslintのVSCode用の拡張機能です。tslintの結果をVSCode上に出力します。
下記リンクからダウンロードしてインストールするか、VSCodeから拡張機能をでインストールします。
https://marketplace.visualstudio.com/items?itemName=eg2.tslint
VSCodeのメニュー『表示』→『拡張機能』で『tslint』で検索。
おわりに
今回は、本当に環境構築だけで終了します。
Webを調べるとこの方法以外にも少し違ったパターンの構築方法が散見されますが、この方法でも構築はできました。
次回は、とりあえず動かす！ということで、実装に必要な設定と恒例の『Hello World!!』をやりたいと思います。
追記（2018/11/28）
今回VSCodeを対象にすすめていくつもりでしたが、色々と調べているとVisual Studio 2017(communityも含む)でも
TypeScriptの開発が可能なことがわかりました。（まぁ、当然といっちゃ当然なのでしょうが。。。）
私自身、仕事でガッツリVisual Studioを使っているので、今後は『Visual Studio 2017 ではじめるTypeScript』に変更したいと思います。