Angular×Visual Studio Code×とりあえず入れたExtensionのまとめ

この記事の目的

この記事は、
Angualarを開発するにあたって、とりあえずinstallしたVS Code Extensionのメモ
を目的としています。

本題

Extention一覧

Angular 8 Sniooets

Typescriptとhtmlのスニペットを提供してくれます。

Angular Language Service

Angular templateを記述するときにパラメータを補完してくれたり、定義に移動できたりする機能を提供してくれます。
これがないと、絶対打ち間違いによるコンパイルエラーが発生するので、とても便利。

Debugger for Chrome

デバッグできないと辛い。。。

indent-Rainbow

インデントをきれいに色づけしてくれるやつ。
きれい。
そして個人的に見やすい。

Prettier-CoddeFormatter

インデントの整理をしてくれるやつ。
typescriptでやると、シングルクォーテーションがダブルクォーテーションに自動的に置き換えられる。ダブルになると、「シングルに直して」という警告がでるため、波線がうっとうしくなる。
これは、何かの設定を変更すればいいのか・・・と思いつつまだ調べられていない。
htmlやCSSに対してのフォーマットは問題なく使えてとても便利。

vscode-icon

エクスプローラーのアイコンが見やすくなる。

TODO Highlight & Todo Tree

どちらもTODOを見やすくしてくれるExtentionです。
TODO Highlightは、TODOをハイライトして見やすくしてくれます。Todo treeはTODOの一覧を作ってくれます。どちらも便利。

//TODO: こんな感じの使い方(=ﾟωﾟ)ﾉ

その他設定

エクスプローラーのインデントが狭くて、どこの階層にファイルがあるのか見づらいときは、以下の設定を変更します。デフォルトは「８」です。個人的に２０くらいにすると見やすく感じました。