Closed6

Cloudflare Pages, Next.js, Sentry 構成を試す(失敗)

9sako69sako6

結論

2024/08/24時点で失敗。

そもそも Sentry を入れるとバンドルサイズが大きくて、Pro プラン最大の 10MiB でも Cloudflare Pages に乗り切らない。

--

  • Next.js v14.2.6
  • @sentry/nextjs@8.26.0
  • @cloudflare/next-on-pages v1.13.2

まずはドキュメントに沿って設定する。

npx @sentry/wizard@latest -i nextjs

https://docs.sentry.io/platforms/javascript/guides/nextjs/

9sako69sako6

デフォルトのセッティング後にビルドでこけた。

▲  ⨯ useSearchParams() should be wrapped in a suspense boundary at page "/sentry-example-page". Read more: https://nextjs.org/docs/messages/missing-suspense-with-csr-bailout
▲     at s (/app/frontend/.next/server/chunks/352.js:69:250997)
▲     at c (/app/frontend/.next/server/chunks/352.js:69:262035)
▲     at P (/app/frontend/.next/server/chunks/991.js:1:19898)
▲     at nj (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:46251)
▲     at nM (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:47571)
▲     at nN (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64546)
▲     at nB (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:67538)
▲     at nD (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:66680)
▲     at nN (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64853)
▲     at nB (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:67538)
▲  
▲  Error occurred prerendering page "/sentry-example-page". Read more: https://nextjs.org/docs/messages/prerender-error
▲  ✓ Generating static pages (5/5)
▲  
▲  > Export encountered errors on following paths:
▲  /sentry-example-page/page: /sentry-example-page
▲  npm ERR!
▲  Lifecycle script `build` failed with error: 
▲  npm ERR! Error: command failed 
▲  npm ERR!   in workspace: @nizitsuku/frontend@1.0.0
▲  npm ERR!   at location: /app/frontend
▲  Error: Command "npm run build" exited with 1
⚡️ The Vercel build (`npx vercel build`) command failed. For more details see the Vercel logs above.
⚡️ If you need help solving the issue, refer to the Vercel or Next.js documentation or their repositories.
The command '/bin/sh -c npx @cloudflare/next-on-pages' returned a non-zero code: 1
Cleaning up project directory and file based variables
00:01
ERROR: Job failed: exit code 1
9sako69sako6

example の page と API に export const runtime = 'edge' 追加でビルドは通るようになったが、アップロードに失敗した。

✨ Compiled Worker successfully
✨ Uploading Worker bundle
✨ Uploading _routes.json
✘ [ERROR] A request to the Cloudflare API (/accounts/[MASKED]/pages/projects/nizitsuku-staging/deployments) failed.
  An unknown error occured. Contact your account team or Cloudflare support: https://cfl.re/3WgEyrH. [code: 8000000]
  
  If you think this is a bug, please open an issue at: https://github.com/cloudflare/workers-sdk/issues/new/choose
Cleaning up project directory and file based variables
00:00
ERROR: Job failed: exit code 1
9sako69sako6

そもそも Sentry を入れるとバンドルサイズが大きくて、Pro プラン最大の 10MiB でも Cloudflare Pages に乗り切らない。

9sako69sako6

他の案:

  • Baselime を使ってみる
  • Sentry REST API を使ってエージェントを自作する
このスクラップは3ヶ月前にクローズされました