数ヶ月ぶりに記事を投稿したところ、Vercelから「デプロイに失敗しました」という内容のメールが届きました。 Vercelにアクセスしてログを確認すると、以下のようなエラーが出力されていました。 <blockquote>Error: Node.js Version "12.x" is discontinued and must be upgraded. Please set Node.js Version to 18.x in your Project Settings to use Node.js 18.</blockquote>どうやら 12.x はサポートが終了したようです。 詳しく調べてみると、2022/10/03 にサポート終了の告知が公式ブログでなされていたようです。<blockquote>On October 3rd 2022, Node.js 12 will be disabled in the Project Settings and existing Projects that have Node.js 12 selected will render an error whenever a new Deployment is created. The same error will show if the Node.js version was configured in the source code.Node.js 12 is being deprecated</blockquote><a href="https://vercel.com/changelog/node-js-12-is-being-deprecated" target="_blank" rel="noopener noreferrer">Node.js 12 is being deprecated – Vercel</a> この機会に 18.x にアップデートしてみます。 <h2 id="h8bb68ed570">Node.jsのアップデート</h2>まず、ローカル環境の Node.js を 18.x に更新してみます。 私の環境ではバージョン管理ツール Nodenv を使用しているため、 以下の方法は参考にならない可能性があります。 それぞれの構築方法に合わせてアップデートを行ってください。 まず、Nodenvからインストールできるバージョンを確認します。<pre><code>$nodenv install -l</code></pre> 18.x の中で最もバージョンが新しい、18.12.0 をインストールすることにしました。 以下のコマンドを実行してインストールを行います。<pre><code>$nodenv install 18.12.0
$nodenv rehash</code></pre> 正常にインストールできているか確認します。リストに 18.12.0が表示されれば成功しています。<pre><code>$nodenv versions
* 12.22.12
 18.12.0</code></pre> 普段は 12.x で開発を行っているため、当ブログの開発にのみ使用するように設定します。 全体で使用したい場合は <code>$nodenv global XX.XX.XX</code> というコマンドを実行してください。<pre><code>$nodenv local 18.12.0</code></pre> ルートディレクトリにバージョンのみ記載された .node-versions というファイルが作成されれば成功です。<pre><code>18.12.0</code></pre> <h2 id="h08a3eb7c23">パッケージのアップデート</h2>アップデートが完了したのでパッケージのインストール後に起動してみましたが、 12.x で動作するよう構成されているため、エラーが出力されて動作しませんでしたので、 インストールされているパッケージのアップデートを行います。 私の環境では yarn v1 を使用してアップデートを行いました。 <code>npm-check-updates</code>というパッケージをインストールします。 インストールされているパッケージの一括アップデートが可能となります。<pre><code>$yarn add npm-check-updates</code></pre> 続いて以下のコマンドを実行します。 アップデートが必要なパッケージがリストアップされます。<pre><code>$yarn ncu</code></pre> 続いて以下のコマンドを実行し、アップデートを行います。<pre><code>$yarn ncu -u</code></pre> 成功すると package.json が書き換わります。 再度パッケージのインストールを実行します。<pre><code>$yarn install</code></pre> インストールが完了後、next.js を起動してみます。 エラーが出力されなくなったのでアップデート作業は完了です。<pre><code>$yarn dev</code></pre> <h2 id="h14588fc126">Vercelで使用するNode.jsのバージョンを変更する</h2>最後にVercelで使用するNode.jsのバージョンを変更します。これは管理画面から変更が可能です。 バージョンを変更したいプロジェクトにアクセス後、Setting をクリックしてください。 <img src="https://images.microcms-assets.io/assets/04d035d8b8b6483ab5e5d941853db4b9/dc390a12c6fb4365aa21e8d506901ae3/vercel-dashboard-node.png?w=1287&amp;h=604" alt="Vercelの管理画面"> General の Node.js Version の値を 18.X に設定すれば作業は完了です。

カテゴリーが「Vercel」の記事

カテゴリ