Next.js with deploy to Cloudflare Pages failed, due to limit of 25 MB, after adding Sentry

[dimylkas]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/nextjs

SDK Version

"@sentry/nextjs": "^8.30.0",

Framework Version

"react": "18.3.1", "next": "^14.2.5", "next-intl": "^3.17.2"

Link to Sentry event

Reproduction Example/SDK Setup

sentry.client.config.ts

import { init, replayIntegration } from "@sentry/nextjs";

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,

  integrations: [replayIntegration()],

  tracesSampleRate: 1,

  replaysSessionSampleRate: 0.1,

  replaysOnErrorSampleRate: 1.0,

  debug: false,
});

sentry.edge.config.ts

import { init } from "@sentry/nextjs";

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,

  tracesSampleRate: 1,

  debug: false,
});

sentry.server.config.ts

import { init } from "@sentry/nextjs";

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  tracesSampleRate: 1,
  debug: false,
});

next.config.js

const withNextIntl = require("next-intl/plugin")();
const { withSentryConfig } = require("@sentry/nextjs");

const intlConfig = withNextIntl(nextConfig);


const autoGenerateConfig = {

    org: "my-org",
    project: "my-org-dev",

    silent: !process.env.CI,

    widenClientFileUpload: true,

    reactComponentAnnotation: {
      enabled: true,
    },

    tunnelRoute: "/monitoring",

    hideSourceMaps: true,

    disableLogger: true,

    automaticVercelMonitors: true,
};

module.exports = withSentryConfig(intlConfig, autoGenerateConfig);

Steps to Reproduce

1. Setup Next.js with App router
2. Setup next-intl for translations (! this probably may be skipped, but that's just setup)
3. Setup Sentry
4. Deploy to Cloudflare Pages (I've created a simular q there - https://community.cloudflare.com/t/generated-pages-functions-bundle-size/713397)

Expected Result

Successful deploy

Actual Result

During the build, I see that everything is fine and bundle size is correct.

...
| ▲ ┌ ƒ / 1.35 kB 191 kB
| ▲ ├ ○ /_not-found 1.03 kB 188 kB
| ▲ ├ ƒ /[locale] 24 kB 478 kB
| ▲ ├ ƒ /[locale]/(.)login 3.16 kB 321 kB
| ▲ ├ ƒ /[locale]/about-us 343 B 188 kB
...
Build Completed
Build Summary (@cloudflare/next-on-pages v1.13.2)

After i see logs:
Attaching additional modules:

...

│ next-on-pages-dist/cache/kv.js │ esm │ 0.35 KiB │
│ next-on-pages-dist/functions/[locale]/(.)login.func.js │ esm │ 1223.31 KiB │
│ next-on-pages-dist/functions/[locale]/about-us.func.js │ esm │ 1218.56 KiB │
...

Compiled Worker successfully

| Generated Pages Functions bundle size (26809243) is over the limit of 25.0 MiB
| Failed: generating Pages Functions failed. Check the logs above for more information. If this continues for an unknown reason, contact support: https://cfl.re/3WgEyrH

And it's failed because of generated Pages function.

I'm trying to understand, smth wrong with config? But I've followed the steps from docs and use npx
It's a right way that each page is wrapped with "withSentryConfig" and adds additional ±1.2 MB, so we hit the limit.
I've also removed this "withSentryConfig" from next.config and everything become normal
Cloudflare or Sentry issue?

[andreiborza]

hi @dimylkas, thanks for writing in. Could you please provide a minimal reproduction repo or stackblitz we can use to investigate this?

[andreiborza]

cc @AbhiPrasad @lforst

[lforst]

@dimylkas no need for a repro. The server-side SDK has a certain size. As of now we don't have any plans to decrease its size (admittedly I wouldn't know how as there are certain restrictions around bundling). 25MB is an incredibly small amount.

You can try using the @sentry/node and @sentry/browser SDKs directly which should be smaller. Other than that you can try to reduce your project size through other means.

[dimylkas]

Hi @lforst,

Ok, then just a FYI - that i've prepared example - ( https://github.com/dimylkas/example-nt-cl-sentry-crush )

So, a certain size is bigger than that limit, right? And is there no way to deploy it there? Or communicate to CL about their issue.

Regards,
Dmytro

[andreiborza]

@dimylkas I'm afraid we can't do much about CF's limit. Maybe you could deploy part of the app to R2? See https://developers.cloudflare.com/pages/platform/limits/#file-size.

[dimylkas]

Hi @andreiborza ,

There are no any assets, from "/[locale]/about-us **343 B** 188 kB" this size you probably see that there is just one div with an h1 element and small text description. As I understood, Next creates the routes, Sentry wraps each route, and at the output we got - /[locale]/about-us.func.js │ esm │ **1218.56 KiB** │ and that's exceed the limit

It's for the history and next user who will face the same problem