WSL でのリモート開発

このチュートリアルでは、Windows Subsystem for Linux (WSL) を有効にし、WSL 拡張機能を使用して Visual Studio Code を WSL で実行する方法を説明します。

前提条件

Visual Studio Code がインストールされている必要があります。

拡張機能をインストールする

WSL 拡張機能を使用すると、Windows Subsystem for Linux (WSL) 内で Visual Studio Code を実行できます。

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

WSL extension

前提条件の確認

WSL 拡張機能をインストールすると、左端に新しいステータスバー項目が表示されます。

Remote Status bar item

リモートステータスバー項目では、VS Code が現在どのコンテキスト(ローカルまたはリモート)で実行されているかをすばやく確認でき、項目をクリックすると WSL 拡張機能のコマンドが表示されます。

WSL extension commands

WSL を有効にする

Windows Subsystem for Linux (WSL) は Windows 10 のオプション機能です。[Windows の機能] ダイアログまたは PowerShell から有効にできます。

[Windows の機能] ダイアログ

Windows の検索バーに「features」と入力して、[Windows の機能の有効化または無効化] ダイアログを表示します。下にスクロールして [Windows Subsystem for Linux] にチェックを入れます。

Turn Windows features on and off dialog

[OK] を選択すると、Windows の再起動を求められます。

PowerShell

必要に応じて、管理者として PowerShell を開き、以下を入力することもできます。

Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

コマンドが実行された後、Windows の再起動を求められます。

PowerShell prompt to restart

WSL の確認

Windows を再起動した後、コマンドプロンプトを開いて「wsl」と入力することで、WSL が有効になっていることを確認できます。

WSL check

WSL は有効になっていますが、まだ Linux ディストリビューションがインストールされていません。

Linux ディストリビューションをインストールする

WSL 用の Linux ディストリビューションは Microsoft Store からインストールします。ストアアプリを使用するか、Windows の検索バーで Linux ディストリビューションを検索してください。インストールしたい Linux ディストリビューション(例: Ubuntu)を選択し、プロンプトに従います。

select Ubuntu distro

[入手] または [インストール] を選択します。

install Ubuntu

完了したら、[開く] を選択して開始します。これにより Linux ターミナルが開き、インストールが完了します。Linux インスタンスを完全にセットアップするため、ユーザー ID とパスワードを作成する必要があります。これで Windows 上で Linux が実行されている状態になります。

Linux terminal

Python 開発

Python がまだインストールされていない場合は、次のコマンドを実行して、Linux インストール環境に Python3 と Python のパッケージマネージャーである pip をインストールします。

sudo apt update
sudo apt install python3 python3-pip

確認するには、以下を実行します。

python3 --version

定番の「Hello World」アプリから始めましょう。「helloWorld」という名前の新しいフォルダーを作成し、実行するとメッセージを表示する Python ファイルを追加します。

mkdir helloWorld && cd helloWorld
echo 'print("hello from python on ubuntu on windows!")' >> hello.py
python3 hello.py

リモートの Linux 環境(この WSL ディストリビューションは技術的には UI を持たない別のマシンであり、たまたまコンピューター上でローカルに実行されているだけです)では、開発ツールやエクスペリエンスがかなり制限されます。ターミナルで Vim を実行してファイルを編集するか、\\wsl$ マウントを通じて Windows 側でソースを編集することができます。

\wsl$ mount

このモデルの問題は、Python ランタイム、pip、またはコンダパッケージなどが Windows 側にインストールされていないことです。

no Python on Windows

注意してください。Python は Linux ディストリビューション内にインストールされています。つまり、Windows 側で Python ファイルを編集している場合、同じ Python 開発スタックを Windows にもインストールしない限り、それらを実行したりデバッグしたりすることはできません。これでは、Python ツールとランタイムをすべて備えた分離された Linux インスタンスを用意した意味がなくなってしまいます!

WSL で実行する

WSL ターミナルで、helloWorld フォルダーにいることを確認し、'code .' と入力して Visual Studio Code を起動します。'.' 引数は、現在のフォルダーを開くように VS Code に指示します。VS Code の Insiders バージョンを使用している場合は、代わりに 'code-insiders .' を実行する必要があります。

注: このコマンドが機能しない場合は、ターミナルを再起動する必要があるか、インストール時に VS Code をパスに追加しなかった可能性があります。

launch VS Code

最初に表示されるのは「Installing VS Code Server」(c7d83e57… という数字は、インストールしたクライアント側のツールと一致する VS Code Server のバージョンです)というメッセージです。VS Code は、デスクトップ版 VS Code が通信するための小さなサーバーを Linux 側にインストールしています。そのサーバーは WSL 内に拡張機能をインストールしてホストするため、WSL にインストールされたツールやフレームワークのコンテキスト内で動作します。言い換えれば、言語拡張機能は Windows 側にインストールされたものではなく、WSL 内にインストールされたツールやフレームワークに対して実行されます。これが本来あるべき正しい開発エクスペリエンスです。

次に、VS Code が起動し、helloWorld フォルダーが開きます。VS Code が WSL に接続していることを示す通知が表示され、Node.js ベースのサーバーへのアクセス許可を求められる場合があります。

installing vscode server

これで、hello.py にマウスホバーすると、正しい Linux パスが表示されます。

show hello.py Linux path

統合ターミナル

[ターミナル] > [新しいターミナル] (⌃` (Windows, Linux Ctrl+`)) を実行して、新しいターミナルインスタンスを開きます。

new terminal in WSL

Windows で実行されている VS Code から、WSL 上の bash シェルの新しいインスタンスを開始します。

ヒント: ステータスバーの左下に、WSL: Ubuntu インスタンスに接続されていることが表示されます。

WSL extension Status bar

編集とデバッグ

Python 拡張機能(および追加ツール)のインストール

hello.py をクリックして編集用に開きます。拡張機能の推奨事項が表示されるので、今回は Microsoft Python 拡張機能をインストールします。これにより、高度な編集およびデバッグ環境が提供されます。[インストール] を選択し、求められた場合はリロードしてください。

Python extension recommendation

拡張機能が WSL にインストールされたことを確認するには、もう一度拡張機能ビュー (⇧⌘X (Windows, Linux Ctrl+Shift+X)) を開きます。[WSL: Ubuntu – インストール済み] というセクションが表示され、WSL 側にインストールされている拡張機能を確認できます。

WSL installed extensions

リロード後、pylint リンターがインストールされていないというプロンプトが表示されます。リンターは、ソースコード内のエラーや警告を表示するために使用されます。[インストール] を選択してください。

pylint not installed notification

これで、コードを編集する際に、リッチな色付けと補完機能が使用できるようになります。

Python IntelliSense

ファイルを保存すると (⌘S (Windows, Linux Ctrl+S))、ファイルに lint エラーや警告が表示されます。

pylint error

デバッグ

ツールがセットアップできたので、さらに一歩進んでみましょう。行番号の左側の余白をクリックするか、行にカーソルを置いて F9 を押して、hello.py の 1 行目にブレークポイントを設定します。

set breakpoint

次に、F5 を押してアプリケーションを実行します。実行方法を尋ねられますが、単純なファイルですので [Python ファイル] を選択してください。

select debug configuration

アプリが起動し、ブレークポイントで停止します。変数の確認、ウォッチの作成、コールスタックの移動が可能です。

F10 を押してステップ実行すると、デバッグコンソールに print 文の出力が表示されます。

VS Code debug view

WSL にインストールされた Linux インスタンスを使用して、Visual Studio Code の完全な開発エクスペリエンスを得ることができます。

WSL 内の別のフォルダーを開きたい場合は、[ファイル] メニューから [フォルダーを開く] を選択します。Windows ファイルシステムではなく、Linux ファイルシステムの簡易的なファイルおよびフォルダーナビゲーターが表示されます。

open folder navigator

Windows に切り替えたい場合は、[ローカルを表示] オプションを選択すると、標準の Windows [ファイルを開く] ダイアログが表示されます。

WSL 接続の終了

[ファイル] > [リモート接続を閉じる] を選択すると、WSL セッションを終了し、VS Code をローカルで実行する状態に戻ることができます。

おめでとうございます

おめでとうございます。このチュートリアルは正常に完了しました!

次に、他のリモート開発拡張機能を確認してみてください。

または、リモート開発拡張機能パックをインストールして、すべてを取得してください。

© . This site is unofficial and not affiliated with Microsoft.