⚠️

Next.jsのサービスをCloudflare PagesにデプロイしたらInternal Server Errorが出た

2025/03/29に公開

Next.js

はじめに

毎月2円くらい稼いでくれている以下サービスの作り直しをしていました。
https://wikimiru.com/

機能的に何か問題があったわけではなく、単純に中身のコードが汚くて嫌だったからです。Tailwind CSSと生のCSSがごっちゃになっていて酷いものでした。

作り直して、いざデプロイしてアクセスしてみるとInternal Server Errorが発生していてまったく動きませんでした。

スクラップを使って色々調べつつ試しつつで何とか解決したのでまとめていきます。

解決方法

Next.jsとそれに伴い諸々のダウングレードを行うことで解決しました。

元々Next.jsはバージョン15系を使用していましたが、私が試した限りだと15系ではexport const runtime = "edge";を使うとエラーが発生してしまっていました。

export const runtime = "edge";はNext.jsをCloudflare Pagesにデプロイする際に必要な記載でNode.jsではなくEdgeランタイムを使用するよ、というものです。

発生していたエラーは以下2つです。

Disallowed operation called within global scope. Asynchronous I/O (ex: fetch() or connect()), setting a timeout, and generating random values are not allowed within global scope

グローバルスコープでfetch()などの非同期処理を実行していると発生するエラーみたいです。以下コードのようなイメージです。

export const runtime = "edge";
// ❌ グローバルスコープで実行
const res = await fetch("https://api.example.com/data");

export default async function Home() {
  const data = await res.json();
  return <div>{data.title}</div>;
}

ただ、実際このようなコードは書いておらず、以下のようにexport const runtime = "edge";があるだけでエラーになっていました。

export const runtime = "edge";

export default function Home() {
  return <div>テストページ</div>;
}

TypeError: Cannot redefine property: __import_unsupported

これはインポートで何かしらの問題があった場合に発生するようで、インポート分をすべて削除すると派生しなくなりました。当然、削除すると何もできなくなるので解決方法としてはよろしくないです。つまるところがexport const runtime = "edge";がある限りエラーを吐き続ける状態になりました。色々調べましたがそれっぽい対応が出てこず、最終手段としてNext.jsのバージョンを下げてみたところうまいこといきました。

ダウングレード

Next.jsとReactのダウングレード

rm -rf node_modules package-lock.json
npm install next@14.1.0 react@18.2.0 react-dom@18.2.0

この後next.config.jsを作成する必要があります。

/** @type {import('next').NextConfig} */
const nextConfig = {};

module.exports = nextConfig;

4系を使っているのであればTailwind CSSもダウングレード

npm install -D tailwindcss@3.4.17

3系用に設定が必要なのでこちらを参照

autoprefixerがないというエラーが出るのでこれをインストール

npm install autoprefixer --save-dev

最後に一応きれいにして実行

rm -rf node_modules package-lock.json
npm install

細かい修正は他にも必要かもしれませんが、大枠はこれで解決できるはずです。

はじめに

解決方法

ダウングレード

Discussion