はじめに

Next.js プロジェクトを作成しようとして npx create-next-app@latest next-app を実行したところ、Unexpected token '??=' というエラーが表示され、先に進めないというトラブルが発生しました。

この記事では、このエラーの原因とその解決方法を分かりやすく解説します。Node.js のバージョン管理ツール nvm を使う方法も紹介します。

書こうと思ったきっかけ

フロントエンド開発を始めようと Next.js の初期プロジェクトを作成する際、思いがけず構文エラーが発生しました。

調べてみると、Node.js のバージョンが古かったことが原因でした。

同じような状況でつまずく方も多いと思い、解決までの流れをまとめておきたいと思いました。

npx create-next-app@latest next-app
npx: 1個のパッケージを0.658秒でインストールしました。
Unexpected token '??='

このエラーは、Node.js のバージョンが古いために ??=（Nullish Coalescing Assignment）という構文が使えないことが原因です。

この構文は Node.js v16.9.0 以降でサポートされています。Node.js v14 や v12 を使っている場合、このエラーが発生します。

node -v

Node.js の公式サイトから最新版（LTS推奨）をダウンロードしてインストールできます。

Node.js のバージョンを簡単に切り替えられる「nvm（Node Version Manager）」を使う方法がおすすめです。

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

その後、以下を実行するか、ターミナルを再起動：

export NVM_DIR="$HOME/.nvm"
source "$NVM_DIR/nvm.sh"

nvm install 22.7.0

nvm use 22.7.0

nvm alias default 22.7.0

node -v
# → v22.7.0 と表示されればOK

Node.js のバージョンをアップデートしたあと、再度以下のコマンドを実行してみましょう：

npx create-next-app@latest next-app

問題なく Next.js のプロジェクトが作成できるはずです。

Node.js のバージョンが原因で起こるトラブルは意外と多く、特に新しい構文を使うライブラリでは注意が必要です。nvm を導入しておくと、今後の開発でも柔軟に対応できるようになるので非常に便利です！