WindowsにWSLをインストールしてReactの開発環境を構築する方法

以下の公式サイトを参考にWSL上にReactの開発環境を構築する。

WSLをインストール

コントロールパネル>プログラム>Windowsの機能の有効化または無効化でLinux用windowsサブシステムのチェックボックスを外す

powershellを管理者権限で開いて、以下のコマンドを打つ

wsl --install

再起動すると自動でWSLが立ち上がる
ユーザー名とパスワードを入力して初期設定完了

nvmをインストール

wslのホームディレクトリに移動してcurlをインストール

cd /

sudo apt-get install curl

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/master/install.sh | bash

一回、wslを閉じて再度開く。
以下のコマンドを打ってnvmと返ってきたら、nvmインストール完了

command -v nvm

Node.jsをインストール

Node.js の現在の安定した LTS版をインストール

install --lts

以下のコマンドでversionが出てきたらOK

nvm ls
->     v18.12.1
default -> lts/* (-> v18.12.1)
iojs -> N/A (default)
unstable -> N/A (default)
node -> stable (-> v18.12.1) (default)
stable -> 18.12 (-> v18.12.1) (default)
lts/* -> lts/hydrogen (-> v18.12.1)
・・・以下省略

npxやnpmが入っていてversionが確認できればOK

npx --version
8.19.2

npm --version
8.19.2

npx create-react-app でプロジェクト立ち上げ

適当なフォルダに移動する
このとき使用するファイルをマウントされた C ドライブ (/mnt/c/Users/yourname$) に保存したりしないように注意する。
npx create-react-app 任意の名前で立ち上げ

npx create-react-app my-app

そのディレクトリに移動

cd my-app

npm start

以下のコマンドでローカルホスト3000番が立ち上がれば完了

npm start