Exporting `Replay` from `@sentry/nextjs`

[kachkaev]

Problem Statement

It’d be great to be able to do the same as #6508, but via @sentry/nextjs.

Current

import { Replay } from "@sentry/browser";
import * as Sentry from "@sentry/nextjs";

// new Replay()

Expected

import * as Sentry from "@sentry/nextjs";

// new Sentry.Replay()

Solution Brainstorm

• Re-export Replay from @sentry/nextjs

[Lms24]

Hi @kachkaev, weird, I thought this should work. The client side NextJS SDK exports * from @sentry/react which exports * from @sentry/browser which exports Replay...

I just tested it in a small NextJS app and for me it seems to work.

[kachkaev]

Can it be a bug related to TypeScript typings and server-side bundle? See CI failure in blockprotocol/blockprotocol#836

tsc output

// sentry.client.config.ts
Property 'Replay' does not exist on type 'typeof import("/path/to/project/node_modules/@sentry/nextjs/types/index.server")'. ts(2339)

next build on Vercel

TypeError: nextjs_.Replay is not a constructor
    at Object.375 (/vercel/path0/apps/site/.next/server/chunks/375.js:24:9)
    at __webpack_require__ (/vercel/path0/apps/site/.next/server/webpack-runtime.js:25:42)
    at __webpack_exec__ (/vercel/path0/apps/site/.next/server/pages/[shortname]/[[...profile-tabs]].js:1412:39)
    at /vercel/path0/apps/site/.next/server/pages/[shortname]/[[...profile-tabs]].js:1413:133
    at Function.__webpack_require__.X (/vercel/path0/apps/site/.next/server/webpack-runtime.js:177:21)
    at /vercel/path0/apps/site/.next/server/pages/[shortname]/[[...profile-tabs]].js:1413:47
    at Object.<anonymous> (/vercel/path0/apps/site/.next/server/pages/[shortname]/[[...profile-tabs]].js:1416:3)
    at Module._compile (node:internal/modules/cjs/loader:1155:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1209:10)
    at Module.load (node:internal/modules/cjs/loader:1033:32)
> Build error occurred
Error: Failed to collect page data for /[shortname]/[[...profile-tabs]]
    at /vercel/path0/node_modules/next/dist/build/utils.js:960:15
    at processTicksAndRejections (node:internal/process/task_queues:96:5) {

[Lms24]

@kachkaev, you're right, TS complains indeed. I opened a PR (#6577) to fix this. Expect it to be released in the next SDK version.

Until then, I guess a good old // @ts-ignore should do the trick.