🚀 VS Code で で入手しましょう!

言語拡張機能の概要

Visual Studio Code は、言語拡張機能を通じて、さまざまなプログラミング言語向けのスマートな編集機能を提供します。VS Code は、コアエディターに言語サポートを組み込んではいませんが、豊富な言語機能を有効にする一連の API を提供しています。

たとえば、HTML 拡張機能は、これらの API を使用して HTML ファイルの構文強調表示を表示します。同様に、console. と入力すると IntelliSense に log が表示されますが、これは Typescript Language Features 拡張機能の働きによるものです。

VS Code には、最初から豊富な言語サポートを提供するために、これらの拡張機能の一部がエディターにバンドルされています。

言語機能は、大きく 2 つのカテゴリに分類できます。

宣言型言語機能

宣言型言語機能は、構成ファイルで定義されています。例としては、VS Code にバンドルされている htmlcsstypescript-basic 拡張機能などがあり、これらは以下の宣言型言語機能のサブセットを提供します。

  • 構文強調表示
  • スニペット補完
  • 括弧のマッチング
  • 括弧の自動閉じ
  • 括弧の自動囲み
  • コメントの切り替え
  • 自動インデント
  • 折りたたみ (マーカーによる)

宣言型言語機能を提供する言語拡張機能を作成するための 3 つのガイドがあります。

  • 構文強調表示ガイド: VS Code は構文強調表示に TextMate グラマーを使用しています。このガイドでは、簡単な TextMate グラマーを作成し、VS Code 拡張機能に変換する手順を説明します。
  • スニペット補完ガイド: このガイドでは、スニペットのセットを拡張機能にバンドルする方法について説明します。
  • 言語構成ガイド: VS Code では、拡張機能が任意のプログラミング言語の言語構成を定義できます。このファイルは、コメントの切り替え、括弧のマッチング/囲み、リージョン折りたたみ (レガシー) などの基本的な編集機能を制御します。

プログラムによる言語機能

プログラムによる言語機能には、自動補完、エラーチェック、定義へのジャンプなどがあります。これらの機能は、多くの場合、Language Server (プロジェクトを分析して動的な機能を提供するプログラム) によって強化されています。一例として、VS Code にバンドルされている typescript-language-features 拡張機能があります。これは、TypeScript Language Service を利用して、次のようなプログラムによる言語機能を提供します。

プログラムによる言語機能の完全なリストはこちらをご覧ください。

multi-ls

Language Server Protocol

Language Server Protocol は、Language Server (静的コード分析ツール) と Language Client (通常はソースコードエディター) 間の通信を標準化することにより、拡張機能の作成者が 1 つのコード分析プログラムを作成し、それを複数のエディターで再利用できるようにします。

プログラムによる言語機能のリストには、すべての VS Code 言語機能と、それらが Language Server Protocol 仕様にどのようにマッピングされるかのリストがあります。

VS Code で Language Server 拡張機能を実装する方法を説明する詳細なガイドを提供しています。

multi-editor

特殊なケース

マルチルートワークスペースのサポート

ユーザーがマルチルートワークスペースを開いた場合、Language Server 拡張機能を適宜調整する必要がある場合があります。このトピックでは、マルチルートワークスペースをサポートするための複数のアプローチについて説明します。

埋め込み言語

埋め込み言語は、Web 開発で一般的です。たとえば、HTML 内の CSS/JavaScript や、JavaScript/TypeScript 内の GraphQL などです。埋め込み言語のトピックでは、埋め込み言語で言語機能を利用できるようにする方法について説明します。