VSCodeのJavaScript用拡張機能Quokkaが便利

VSCode用の拡張機能「Quokka」が便利だったので紹介します。JavaScriptのコーディングの際にエラーになる箇所を実行前に評価してくれてリアルタイムに表示してくれる拡張機能です。

使い方

エディタ左側のExtensionsにて「Quokka」と検索し、インストールします。

その後、実行したいファイルを開き、 Cmd + Shift + p > 「Quokka.js: Start on Current File」を選択すればOKです。

何が便利なのか

リアルタイムにコードの内容を実行、評価してくれる

コーディングと同時にコードの内容を実行評価してくれて、エラーがある場合はその内容を当該コードの右側に表示してくれます。

また、変数の値をconsole.logなどを使うことなく表示してくれます。

コードカバレッジがわかる

左側の色のついた四角は実行されたコードのカバレッジになります。テスト実行されたコードとそうでないコードがわかるようになっています。

• 灰色: 未実行
• 緑色: テスト済で問題なし
• 黄色: 部分的にテスト済
• 赤色: エラー

まとめ

大変便利なので、フロントエンドのコードを書く際は利用することをおすすめします。