Visual Studio Codeを、JavaScriptのIDEにする

Visual Studio Codeを、JavaScriptIDEにする』と書いてますが、要は使いやすくするということです。

 

JavaScriptVisual Studio Codeで書いてきて、いまさら別のソフトは使いたくないという方は見てください。

 

なんといっても、デバッグサポートがないと、精神的につらいですが、React.jsを使っていると、ブラウザにエラーメッセージが出るので、これで代用できますね。(JavaScriptだけの場合は、ブラウザを開いて、開発者オプションを開いて確認する必要がありましたが)

以下の三つは、デフォルトでは、Visual Studio Code(以下、VSCodeと略)には入っていないので追加していきます。

まず、『予測変換』機能です。Emmetというらしいです。

VSCodeの右下の設定ボタンを押して、設定を選択します(拡張機能ではないです)。

目次の一番したの『拡張機能』を選択します。(機能>拡張機能ではないです)。

Emmetを選択します。

その中の include languagesに項目を追加します。例としてjavascript用の記載があるので、それをそのまま記載します。

一度VSCodeを閉じて、また起動します。これでできるようになっているはずです。

 

次に、『auto import』です。

少してこずりましたが、最終的には、

右下の設定ボタンを押して、今度は『拡張機能』を選択。

MarketPlaceで拡張機能を検索するという欄に『import』と打ち込みます。

ES6 import Formatterというものを選びインストールします。

一度VSCodeを閉じて、再度起動すると、auto importができるようになってます。

(インストールするのを間違えるとできません。似たようなものがあるので気を付けてください。ほかにもいいものがあるかもしれません。)

最後にESLintです。これも上記と同様の方法でインストール可です。