【備忘録】Visual Studio CodeでTypeScriptを使えるようにするまで

Microsoftさんが無償で配布しているVisual Studio Code、サクサク動いてなかなか使い勝手がよさそうな感じです。
とりあえず英語のマニュアルを読みながら、使える（Typescriptでコーディングができる）ところまで持っていきたいと思います。
https://code.visualstudio.com/　にアクセスして、とりあえずVisual Studio Codeをダウンロード。
nodeのコンソールで

npm install -g typescript

を実行して、tscをインストール。
サイドバー（エクスプローラーっぽくファイルが表示されているところ）を右クリックして「New File」をクリック。
tsconfig.json を作成する。
とりあえず

{
	"compilerOptions": {
	"target": "ES3",
	"module": "commonjs",
	"sourceMap": true	
	}
}

こんな感じにしとく。（目的に合わせて適宜変更してください。）

キーボードの「F1」を押して、「Configure Task Runner」と入力してエンターキー。
これで.vscodeフォルダができて、中にtasks.jsonができます。
このままだと、HelloWorld.tsしかコンパイルしない素敵仕様なので、ここを変更しないといけません。
tasks.jsonの

"args": ["HelloWorld.ts"],

をコメントアウトしちゃいましょう。

//"args": ["HelloWorld.ts"],

とりあえずこれでCtrl+Shift+Bを押すとコンパイルされるようになります。
正しいのかどうかは知らん。（ひどい

絶対正しいやり方（たぶんメニューからFiles→Preferences→UserSettings）があるけど、とりあえずCtrl+Shift+Fでfiles.excludeを検索。
見つからんとメッセージが出るが、その下に「Open Settings」というリンクが出るのでクリック。
settings.jsonが出来上がり、その中にfiles.excludeと入力するとIntelliSenseが効いてコード書いてくれちゃうので任せる。

{
	"files.exclude": {
		"**/.git": true,
		"**/.DS_Store": true, //この行の最後のカンマ追記
		"**/*.js": { "when": "$(basename).ts"} //この行追記
	}
}

これで同名の.tsファイルがある.jsファイルはサイドバーに表示されなくなりました。
.tsファイルがない.jsはちゃんと表示されます。便利。
一応これで書くことはできるんじゃないでしょうか。

デバッグ

一番左のビューバーの虫アイコンクリック→上の歯車マーククリック。
これでlaunch.jsonが開きます。

	"configurations": [
	//ここから追記。内容は適宜変更してください。
		{
			"name": "Launch",
			"type": "node",
			"request": "launch",
			"program": "app.js",
			"stopOnEntry": false,
			"args": [],
			"cwd": ".",
			"runtimeExecutable": null,
			"runtimeArgs": [
				"--nolazy"
			],
			"env": {
				"NODE_ENV": "development"
			},
			"externalConsole": false,
			"preLaunchTask": "",
			"sourceMaps": true,
			"outDir": null
		},
		{
			"name": "Attach",
			"type": "node",
			"request": "attach",
			"port": 5858
		}
	//ここまで追記
	]

これで、とりえずF5押すだけでデバッグが走るようになります。