Linux 用 Windows サブシステムで Visual Studio Code の使用を開始する

[アーティクル]
03/21/2023

Visual Studio Code と WSL 拡張機能を使用すると、VS Code から直接、WSL をフルタイムの開発環境として使用できます。次の操作を行います。

Linux ベースの環境で開発する
Linux 固有のツールチェーンとユーティリティを使用する
Outlook や Office などの仕事効率化ツールへのアクセスは維持しながら、Linux ベースのアプリケーションを Windows から快適に実行してデバッグする
VS Code の組み込みのターミナルを使用してお好みの Linux ディストリビューションを実行する
Intellisense コード補完、リンティング、デバッグサポート、コードスニペット、ユニットテストなどの VS Code の機能を利用する
VS Code の組み込みの Git サポートにより、お使いのバージョン管理を簡単に管理する
WSL プロジェクトで直接コマンドや VS Code 拡張機能を実行する
パスの問題、バイナリの互換性、その他 OS 間の課題について心配することなく、Linux またはマウントされた Windows ファイルシステム (例: /mnt/c) 内のファイルを編集する

VS Code と WSL 拡張機能をインストールする

VS Code のインストールページにアクセスして、32 ビット版または 64 ビット版のインストーラーを選択します。 Visual Studio Code を (WSL ファイルシステム内ではなく) Windows にインストールします。
インストール中に [追加タスクの選択] が求められたときは、コードコマンドを使用して WSL でフォルダーを簡単に開くことができるように、[PATH への追加] オプションがオンになっていることを確認してください。
Remote Development 拡張機能パックをインストールします。この拡張機能パックには、リモート - SSH 拡張機能と Dev Containers 拡張機能に加えて、WSL 拡張機能が含まれており、コンテナー、リモートコンピューター、または WSL 内の任意のフォルダーを開くことができます。

重要

WSL 拡張機能をインストールするには、 VS Code の 1.35 May リリースバージョン以降が必要です。 WSL 拡張機能なしで VS Code で WSL を使用することはお勧めしません。オートコンプリート、デバッグ、リンティングなどのサポートが失われます。楽しい事実: この WSL 拡張機能は、$HOME/.vscode/extensions にインストールされます (PowerShell でコマンド ls $HOME\.vscode\extensions\ を入力します)。

Linux ディストリビューションを更新する

一部の WSL Linux ディストリビューションには、VS Code サーバーの起動に必要とされるライブラリが不足しています。パッケージマネージャーを使用することで、追加のライブラリを Linux ディストリビューションに追加できます。

たとえば、Debian または Ubuntu を更新するには、次を使用します。

sudo apt-get update

wget (Web サーバーからコンテンツを取得するため) と ca-certificates (SSL ベースのアプリケーションで SSL 接続の信頼性を確認するのを許可するため) を追加するには、次を入力します。

sudo apt-get install wget ca-certificates

Visual Studio Code で WSL プロジェクトを開く

コマンドラインから

お使いの WSL ディストリビューションからプロジェクトを開くには、そのディストリビューションのコマンドラインを開いて、「code .」と入力します。

VS Code リモートサーバーを使用して WSL プロジェクトを開く

VS Code から

VS Code でコマンドパレットを表示するショートカット CTRL+SHIFT+P を使用して、より多くの VS Code WSL オプションにアクセスすることもできます。次に入力 WSL すると、使用可能なオプションの一覧が表示され、WSL セッションでフォルダーを再度開いたり、開くディストリビューションを指定したりできます。

VS Code のコマンドパレット

VS Code WSL 内の拡張機能

WSL 拡張機能は VS Code を "クライアントサーバー" アーキテクチャに分割し、クライアント (ユーザーインターフェイス) は Windows コンピューター上で実行し、サーバー (コード、Git、プラグインなど) は WSL ディストリビューションで "リモート" で実行します。

WSL 拡張機能を実行すると、[拡張機能] タブを選択すると、ローカルコンピューターと WSL ディストリビューションの間で分割された拡張機能の一覧が表示されます。

テーマなどのローカル拡張機能をインストールするには、1 回インストールするだけで済みます。

Python 拡張機能や、リンティングやデバッグなどを処理するものなど、一部の拡張機能は、各 WSL ディストリビューションに個別にインストールする必要があります。 WSL ディストリビューションにインストールされていない拡張機能がローカルにインストールされている場合は、VS Code に警告アイコン ⚠が緑色の [WSL にインストール] ボタンと共に表示されます。

WSL 拡張機能とローカル拡張機能を使用した VS Code

詳細については、VS Code のドキュメントを参照してください。

WSL で VS Code を起動すると、シェルスタートアップスクリプトは実行されません。追加のコマンドを実行する方法や、環境を変更する方法の詳細については、こちらの高度な環境のセットアップスクリプトの記事を参照してください。
WSL コマンドラインから VS Code を起動することに関して問題が発生していませんか? こちらのトラブルシューティングガイドには、パス変数の変更、不足している依存関係に関する拡張機能のエラーの解決、Git の行の末尾に関する問題の解決、リモートマシンへのローカル VSIX のインストール、ブラウザーウィンドウの起動、ローカルホストポートの無効化、Web ソケットが機能しない、拡張機能データの格納エラーなどに関わるヒントが含まれています。

Git のインストール (省略可能)

共同作業で開発する場合や、(GitHub のような) オープンソースサイトでプロジェクトをホストする場合のために、VS Code では Git によるバージョン管理がサポートされています。 VS Code の [ソース管理] タブでは、すべての変更が追跡され、一般的な Git コマンド (追加、コミット、プッシュ、プル) が UI に組み込まれています。

Git をインストールするには、Linux 用 Windows サブシステムで機能するように Git をセットアップする方法に関する記事を参照してください。

Windows ターミナルをインストールする (省略可能)

新しい Windows ターミナルでは、複数のタブ (コマンドプロンプト、PowerShell、複数の Linux ディストリビューション間をすばやく切り替える)、カスタムキーバインド (タブを開くまたは閉じる、コピーと貼り付けを行うなどのための独自のショートカットキーを作成する)、絵文字 ☺、カスタムテーマ (配色、フォントスタイルとサイズ、背景画像/ぼかし/透明度) を有効にすることができます。詳細については、Windows ターミナルのドキュメントで確認してください。

Microsoft Store で Windows ターミナルを取得します: ストアを介してインストールすると、更新プログラムが自動的に処理されます。
インストールが完了したら、Windows ターミナルを開き、 [設定] を選択して、profile.json ファイルによってターミナルをカスタマイズします。

その他のリソース

他にも検討をお勧めする拡張機能として、次のようなものがあります。

他のエディターからのキーマップ: これらの拡張機能は、別のテキストエディター (Atom、Sublime、Vim、eMacs、Notepad++ など) から移行する場合に、ご利用の環境を快適に保つのに役立ちます。
設定の同期: GitHub を使用して、異なるインストール間で VS Code の設定を同期させることができます。複数のコンピューターで作業する場合、この機能によってコンピューター間で環境の一貫性を保つことができます。
Chrome 用デバッガー: Linux を使用してサーバー側で開発を完了したら、クライアント側を開発してテストする必要があります。この拡張機能により、ご利用の VS Code エディターと Chrome ブラウザーのデバッグサービスが統合され、効率がより向上します。