VS Code の JavaScript 拡張機能
Visual Studio Code は、JavaScript および Node.js 開発のための多くの機能をサポートしています。ダウンロードした製品に同梱されている機能は、デバッグ、IntelliSense、コードナビゲーションなどのコア機能です。
これらのコア機能に加えて、多数の高品質な拡張機能をインストールすることで、VS Code に JavaScript 開発用の機能を追加できます。
ヒント: 拡張機能のインストールおよび管理方法については、拡張機能のドキュメントを参照してください。
拡張機能の検索
拡張機能ビューの検索バーに JavaScript と入力すると、JavaScript 拡張機能を見つけることができます。あるいは、タグ「tag:javascript」を使用して JavaScript 拡張機能を探すことも可能です。VS Code 内、または Marketplace でさらに多くの拡張機能を検索してください。
さらに、Node.js 拡張機能を検索することもできます。
ヒント: 上記の拡張機能は動的にクエリされています。上の拡張機能タイルをクリックして説明やレビューを読み、自分に最適な拡張機能を確認してください。詳細は Marketplace をご覧ください。
推奨される拡張機能
初心者の方に、ぜひ試していただきたい拡張機能をいくつか紹介します。
ESLint
Marketplace - ESLint
公開元 - Microsoft
ESLint を簡単にプロジェクトに統合できます。ESLint がお好みでない場合は、JSHint、JSCS、JS Standard など、他のさまざまなリントツール拡張機能から選択できます。
JavaScript リントツールの設定に関する詳細は、VS Code の ドキュメント をお読みください。
SonarLint
Marketplace - SonarLint
公開元 - SonarSource
SonarLint は、コーディング中にバグやセキュリティの問題を見つけて修正するのに役立ちます。この拡張機能はバックグラウンドで実行され、スペルチェッカーのようにコーディングの問題を強調表示します。SonarLint は問題の内容を知らせるだけでなく、なぜその問題が有害なのか、どうすれば修正できるのかといったコンテキストに応じたガイダンスと関連する例を提供します。この拡張機能は 200 以上の JS/TS ルール をサポートしており、コーディングの問題を自動的に処理するためのいくつかの クイック修正 (Quick Fixes) が含まれています。
VS Code Marketplace で「SonarLint」を検索してインストールしてください。設定は不要です。ほとんどのユーザーに適したデフォルトのプロファイルから開始し、特定のニーズに基づいてカスタマイズすることができます。
JavaScript (ES6) コードスニペット
Marketplace - JavaScript (ES6) code snippets
公開元 - charalampos karypidis
VS Code には多くの組み込みコードスニペットが付属しています。JavaScript (ES6) code snippets 拡張機能は、ES6 (ECMAScript 6) 構文用のスニペットを追加します。この拡張機能が提供するスニペットのほんの一部を以下に示します。このパックが提供する多数のスニペットについては、拡張機能の README を参照してください。
JavaScript スニペットに関する詳細は、VS Code の ドキュメント を参照してください。Angular 1、Angular 2、Bootstrap 3、ReactJs、jQuery など、その他のスニペットパックについては、Marketplace の スニペットカテゴリ を確認してください。
npm IntelliSense
Marketplace - npm IntelliSense
公開元 - Christian Kohler
この拡張機能は、import または require を使用する際に npm モジュールの IntelliSense を提供します。
