Next.jsをCloudflareで使う時に `await is not defined`が出たら見る記事
RevTech / Serverless Devの岡本さんがCloudflare Pagesでアプリをデプロイする際にハマった点を共有しました。Next.jsのバージョン15.1.0でawaitが使えないエラーが発生し、next.config.tsをmjsに変更することで対応しました。変更後に再起動すると問題が解決し、Next.js 15.1.0でアプリが正常に動作したようです。
広告ここから
広告ここまで
目次
RevTech / Serverless Devの岡本です。いまだにNext.jsはPage Routerでの実装に引っ張られやすく、定期的にPCの前で悩んでいます。今回はCloudflare Pagesでデプロイするアプリを実装する際にハマった点を1つ紹介します。
試していたNext.jsのバージョン
- Next.js 15.1.0
発生した現象
セットアップしたNext.jsアプリを起動させようとした際、次のエラーが発生しました。
> next dev
/Users/sandbox/dev/next.config.compiled.js:16
await (0, _nextdev.setupDevPlatform)();
^
ReferenceError: await is not defined
at Object.<anonymous> (/Users/sandbox/dev/next.config.compiled.js:16:5)
at Module._compile (node:internal/modules/cjs/loader:1369:14)
awaitが使えないと言われています。これはnext.config.tsの中に追加されているawait setupDevPlatform();のことを指しています。
import { setupDevPlatform } from '@cloudflare/next-on-pages/next-dev';
// Here we use the @cloudflare/next-on-pages next-dev module to allow us to use bindings during local development
// (when running the application with `next dev`), for more information see:
// https://github.com/cloudflare/next-on-pages/blob/main/internal-packages/next-dev/README.md
if (process.env.NODE_ENV === 'development') {
await setupDevPlatform();
}
/** @type {import('next').NextConfig} */
const nextConfig = {
/* config options here */
};
export default nextConfig;
対応: next.config.tsをmjsに変更する
簡単な対処法はこちらでした。拡張子をmjsに変更します。
mv next.config.ts next.config.mjsこれで動作してくれました。
> next dev
▲ Next.js 15.1.0
- Local: http://localhost:3000
- Network: http://192.168.128.9:3000
✓ Starting...
✓ Ready in 5.2s