WindowsにWSL2+Ubuntu20.04をインストールした。
ubuntuに入ってるファイルをWindows側のVSCodeで開けないかなと思ってやってみました。
私の環境は
Windows10
WSL2
Ubuntu20.04
WindowsにVisual Studio Codeをインストール
https://code.visualstudio.com/Download
ここからWindows用のインストーラーをダウンロードします。Visual Studio Code (VSCode) は、Microsoftが提供する高機能なコードエディタで、様々なプログラミング言語に対応しており、拡張機能によって機能を拡張できます。WSLとの連携も強力で、Ubuntu上のファイルをシームレスに編集・デバッグすることが可能です。VSCodeは、その強力な機能と拡張性から、Web開発、Python開発、C++開発など、幅広い開発分野で利用されています。

User Installerというのはインストールしたユーザーだけが使える版で、
System Installerというのは全ユーザーが使える版のようです。System Installerを選択すると、管理者権限が必要になりますが、すべてのユーザーがVSCodeを利用できるようになります。System Installerは、複数人でPCを共有する場合や、特定のユーザーに限定せずにVSCodeを利用させたい場合に便利です。User Installerは、個人の開発環境として利用する場合に適しています。
zip版もあるけど今回は間違えてUser版をダウンロードしました。(System版にすればよかった‥)
・使用許諾に同意して

・インストール先の指定
次へ

・スタートメニューフォルダの指定
次へ

・追加タスクの選択
デスクトップ上にアイコンを作成するだけ追加チェックを入れた

インストール完了

Visual Studio Codeの設定とRemote WSL拡張機能のインストール
WindowsでVSCodeを起動してみる。

すると、画面右下に「表示言語を日本語に変更するには言語パックをインストールします」と出てきたので、「インストールして再起動」を押しました。
画面左側にあるメニューボタンから「拡張機能」ボタンを押して。検索窓にwslと入力。Remote – WSLというのが出てきたので、これをインストールした。(Remote WSL)

拡張機能Remote -WSLについては
Linux用のWindowsサブシステム内の任意のフォルダーを開くことにより、Windowsの快適さからLinuxを利用した開発エクスペリエンスを取得します。
しかし、それよりも「VisualStudioCodeリモート開発拡張パック」をインストールした方が便利です。この拡張パックは、Remote – WSLだけでなく、Remote – SSHやRemote – Containersといった他のリモート開発環境もまとめてインストールできるため、将来的な拡張性も考慮するとおすすめです。リモート開発は、クラウド上のサーバーや仮想マシンなど、ローカル環境以外の環境で開発を行う手法です。この拡張パックを導入することで、様々なリモート開発環境を簡単に構築できます。
こっちの方は
・リモートSSH
・リモートコンテナー
・リモートWSL
と3つも入るので、将来的に他のリモート開発環境を利用する可能性も考慮するとおすすめです。SSH (Secure Shell) は、ネットワーク経由で安全にリモートコンピュータにアクセスするためのプロトコルです。リモートコンテナーは、Dockerコンテナー内で開発環境を構築し、アプリケーションを開発・実行するための機能です。
UbuntuでVisual Studio Codeを起動
ubuntuにログインしなおして「code .」と入力すれば、VSCode Server for x64のダウンロードとインストールが始まる。このコマンドを実行すると、WSL2上にVSCode Serverがインストールされ、Windows側のVSCodeからUbuntuのファイルシステムにアクセスできるようになります。初回実行時は、インストールに時間がかかる場合があります。`code .`コマンドは、現在のディレクトリをVSCodeで開くためのコマンドです。このコマンドを実行することで、WSL2上のファイルシステムをWindows側のVSCodeで直接編集できるようになります。

VSCodeが起動して、「このフォルダー内のファイルの作成者を信頼しますか?」の画面が出てくるので「はい」を選択。これは、セキュリティ上の確認であり、信頼できるフォルダーであることをVSCodeに伝える必要があります。この確認を省略すると、セキュリティ上のリスクが高まる可能性があるため、信頼できるフォルダーであることを確認してから「はい」を選択するようにしましょう。

あとはVSCodeを使いやすいようにカスタマイズしてもよい。テーマの変更、ショートカットキーの設定、拡張機能の追加など、様々なカスタマイズが可能です。VSCodeのカスタマイズを行うことで、開発効率を大幅に向上させることができます。例えば、お気に入りのテーマを設定したり、よく使うショートカットキーを割り当てたりすることで、より快適に開発を行うことができます。
Ubuntuに接続してることがわかる。VSCode上でターミナルを開くこともできたり。WSLターミナルがVSCodeの統合ターミナルとして利用できるため、コマンドライン操作もスムーズに行えます。統合ターミナルは、VSCode内でコマンドライン操作を行うための機能です。これにより、VSCodeから離れることなく、ファイルの編集やコンパイル、実行などの操作を行うことができます。

Ubuntuのファイルを作成したり、編集したり、VSCodeを使って開発ができそうです。WSL2とVSCodeの連携により、Linux環境での開発をWindows上で行うことができ、開発効率が大幅に向上します。特に、Linux環境でしか動作しないツールやライブラリを使用する場合に、この連携は非常に有効です。
トラブルシューティング
もし、`code .` コマンドが認識されない場合は、WSL2が正しくインストールされているか、VSCode Serverが正常にインストールされているかを確認してください。また、VSCodeの再起動や、WSL2の再起動を試すことも有効です。さらに、WSL2のバージョンが最新であるか確認し、必要であればアップデートしてください。WSL2のアップデートは、Microsoft Storeから行うことができます。
よくある問題と解決策:
- WSL2が起動しない: コントロールパネルから「Windowsの機能の有効化または無効化」を開き、「Linux用Windowsサブシステム」にチェックが入っていることを確認してください。
- VSCode Serverのインストールが途中で止まる: ネットワーク接続を確認し、ファイアウォールがVSCode Serverの通信をブロックしていないか確認してください。
- ファイルが正しく表示されない: VSCodeの再起動、WSL2の再起動、またはVSCodeの拡張機能の再インストールを試してください。
関連キーワード
WSL2, Ubuntu, VSCode, リモート開発, Linux, Windows, 開発環境, コードエディタ, 拡張機能, Remote WSL, VSCodeリモート開発拡張パック, SSH, Docker, 統合ターミナル, WSLアップデート, トラブルシューティング
この記事が、Ubuntu上のファイルをWindowsのVSCodeで開くためのお役に立てば幸いです。快適な開発環境を構築し、効率的な開発を実現しましょう。

