前提条件

今回の環境の設定では、以下のマシンの環境で検証をしました。

• Intel Core i7-1260
• メモリ 32GB
• Windows 11 Pro 24H2

基本的には WSL が動く環境であれば、下記の手順で環境を整備していくことが可能です。

WSL の環境を整える

まず WSL を実行するためにはいくつかのコンポーネントをインストールする必要があります。この手順は、以下のコマンドを実行することで進めていくことができます。

• ターミナルを管理者モードで起動する
• 以下のコマンドを実行してください

• コマンドを実行すると、自動的にサブシステムのダウンロード、インストール、そしてWindows コンポーネントを有効化していきます

• インストール完了後、マシンを再起動します

再起動が完了すると、WSL を利用することが可能となります。

Ubuntu のインストール

Microsoft Store から Linux のインストールイメージを選択します。今回は、Ubuntu のアプリをインストールします。

初回起動をした際には、ユーザー名とパスワードを設定する必要があります。画面に表示される手順に従って、設定を進めてください。

インストールをした Ubuntu のシステムのパッケージインデックスを更新します。

これで様々なパッケージをインストールする準備が整いました。

Node.js のインストール

Next.js や Astro などのアプリを開発する環境を整えていくために、まずは Node.js をインストールしていきます。なお、node のバージョンを簡単に切り替えることができるようにするために n をインストールしていきます。

以下のコマンドでもインストールが可能ですが、

ここでは以下のサイトのスクリプトを利用します。

• https://github.com/mklement0/n-install

この手順に沿って行った場合、sudo を毎回実行しなくても node を利用することが可能となります。以下のコマンドを実行します。

インストールを実行するかどうかの確認が表示されます。デフォルトでは No となっているので必ず y を押して実行してください。

インストール完了後、以下のコマンドを実行してインストールしたパスを有効にします。

バージョンの確認をすると以下のように確認することができました。

Visual Studio Code のインストール

WSL で稼働する Ubuntu の環境で node が動くようになりました。続いて、Visual Studio Code をインストールします。Visual Studio Code は Windows の環境にインストールをします。今回は Microsoft Store からインストールをしています。

インストールをした Visual Studio Code を起動して、機能拡張のインストールの画面を開いて WSL の3文字を入力、検索結果として出てくる Microsoft の機能拡張の WSL をインストールしてください。

これで Visual Studio Code が WSL と連携して動作するようになります。早速、Ubuntu のコマンドラインの画面を開いて、以下のコマンドを実行します。

初回は、必要なコンポーネントを Ubuntu の環境にインストールを実行します。

Visual Studio Code が起動すると、Ubuntu の環境とつながっていることを確認することができます。以下の画面の左下に WSL:Ubuntu と表示されており、またファイルはすべて Ubuntu のホームのファイルが表示されていることがわかります。

上記の状況になったところで、Visual Studio Code を利用して Ubuntu の環境での開発が可能になりました。

更新履歴

• 2025-07-14 n のインストール手順を macOS の手順に合わせました。