Windows 11 Homeで開発環境を整える

WSL Windows11 VSCode

WSLとVSCodeの連携

はじめに

ゆくゆくはRustで、クラウド環境のリソースを操作したりコスト計算したりしたいのだが、そうなる前にまずは作業環境をと考えて、最初はこの辺から作っておこうと思う。

Windows 11 で 開発環境を構築

今回使用した環境は以下の通り。

  • OS: Windows11 home
    • WSL: Ubuntu 22.04.4 LTS
  • IDE: VSCode 1.90.2

WSLのインストールと設定

Windows Subsystem for Linux

インストール手順

Ubuntu 22.04.4 LTS を使いたいのでこんな感じ。

まずは PowerShell を起動して、このコマンドを叩く

wsl --install

このコマンドを実行して、ヘルプが表示された場合は既にWSLがインストールされているので次へ行こう。

そうでなければこんな画面になるはずだ。(2024-06 現在)

wsl --install
インストール中: Ubuntu
[                           0.0%                           ]   
 wsl --install
インストール中: Ubuntu
[==========================62.0%====                       ]

インストールが完了するとこんな感じになる。

wsl --install
インストール中: Ubuntu
Ubuntu がインストールされました。
Ubuntu を起動しています...
[ユーザ名]@[システム名]:~$ 

これでとりあえずは、WSLのインストールは終了。
すでに最後の行でLinuxのBashが起動しているのが確認できる。

VSCodeのインストールとWSLへの接続

Visual Studio Code

Visual Studio Codeのインストールは、インストールページからインストーラーをダウンロードしてきて実行すれば終了。

Download Visual Studio Code

インストールページ: https://code.visualstudio.com/download

※インストール中に [追加タスクの選択] が求められたときは、コード コマンドを使用して WSL でフォルダーを簡単に開くことができるように、[PATH への追加] オプションがオンになっていることを確認

https://learn.microsoft.com/ja-jp/windows/wsl/tutorials/wsl-vscode

Remote Development 拡張機能パック

VSCodeに、Remote Development をインストールする。

この拡張機能パックには、Remote – SSH 拡張機能と Dev – Containers 拡張機能に加え、WSL 拡張機能が含まれています。これにより、コンテナー内、リモート マシン上、または WSL 内の任意のフォルダーを開くことができます。

https://learn.microsoft.com/ja-jp/windows/wsl/tutorials/wsl-vscode
VSCode + Remote Development

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

ここまででき上れば使い方は簡単だった。

WSL からプロジェクトを開くには、コマンド ラインを開いてプロジェクトを管理しているディレクトリに移動し「code .」と入力すれば、VSCode が開く。

cd
cd projects/
code .
VSCode
VSCode

ここまでのまとめ

Windows 11 でのLinux開発環境構築準備は、意外なほどあっさりと済む。以前であればWSLにしろVSCodeにせよ、どちらかで何らかのトラブルが発生し、わちゃわちゃしていた覚えがあるが、日々移り変わっているということだろうか。

WSL上でVSCodeを開くには、他にも VS Code でショートカットを使用する方法があるようだ。 CTRL+SHIFT+P を使用して コマンド パレット と呼ばれる接続先一覧を呼び出すことができるらしい。詳しいことは参考にした「 https://learn.microsoft.com/ja-jp/windows/wsl/tutorials/wsl-vscode 」をご確認いただきたい。

とりあえずはこれで、今日からあれこれできそうだ。

Windows 11 Homeで開発環境を整える

株式会社 十志 / JUICY LTD.をもっと見る

購読すると最新の投稿がメールで届きます。


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

株式会社 十志 / JUICY LTD.をもっと見る

今すぐ購読し、続きを読んで、すべてのアーカイブにアクセスしましょう。

続きを読む