🌀

Windows+Volta+Reactプロジェクトを作成する

1 min read

2022年1月1日時点のWindows10での情報です。
あけましておめでとうございます。

昨年はWindows+VoltaでAngularプロジェクトを作成しました。
Windows+Volta+Angularプロジェクトを作成する(まとめ)

今回はWindows+Volta+Reactプロジェクトを作成していきます。

なぜVoltaなのかはコチラ
WindowsでNode.jsバージョン管理ツールをどれにするか

VSCodeのインストール、Voltaのインストールはコチラ
Visual Studio Code のインストール
Node.jsバージョン管理 VoltaをWindowsにインストールする

VoltaでReactプロジェクトを作成する

まずはプロジェクト用の作業フォルダを作成し、VsCodeで起動します。
ターミナルウィンドウから、installコマンドでnode.jsをインストールします。
2022/01/01時点での推奨版16.13.1をインスールしました。

volta install node@16.13.1

次にReactプロジェクトを作成します。

npx create-react-app myapp

cdコマンドで、作成したプロジェクトに移動します。

cd myapp

voltaでNode.jsのバージョンを固定します。

volta pin node

package.jsonに以下のような、voltaの設定が追加されます。

package.json
"volta": {
   "node": "16.13.0",
}

以上でReactプロジェクトの作成は終了です。

動作確認してみます。
開発用の簡易サーバーでReactプロジェクトを起動します。

npm start --open

以下の画面が表示されれば成功です。

Discussion

ログインするとコメントできます