pnpmでNext.jsを立ち上げるまでの環境構築

pnpmでNext.jsを立ち上げるまでの環境構築になります。

https://pnpm.io/ja/

pnpmをインストール

まずはpnpmをインストールします。

Homebrew経由でインストールする場合は下記のコマンドで可能です。

brew install pnpm

pnpmでNext.jsをインストール

続いて、pnpmでNext.jsをインストールします。

pnpm dlx create-next-app@latest

Next.jsの初期設定を質問されるので設定します。

✔ Would you like to use TypeScript with this project? … 
✔ Would you like to use ESLint with this project? … 
✔ Would you like to use Tailwind CSS with this project? … 
✔ Would you like to use `src/` directory with this project? … 
✔ Use App Router (recommended)? … 
✔ Would you like to customize the default import alias? … 

インストールが完了すると下記のディレクトリ構成が作られます。

Next.jsを立ち上げる

Next.jsのインストールが完了したら下記のコマンドで立ち上げます。

pnm run dev

無事にhttp://localhost:3000でNext.jsが立ち上がればpnpmでの環境構築は完了です。