'wrapAppGetInitialPropsWithSentry' is not exported from '@sentry/nextjs'

[bjarn]

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

7.61.1

Framework Version

Next 13.4.12

Link to Sentry event

No response

SDK Setup

// This file configures the initialization of Sentry on the client.
// The config you add here will be used whenever a users loads a page in their browser.
// https://docs.sentry.io/platforms/javascript/guides/nextjs/

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

Sentry.init({
  dsn: "",

  environment: process.env.CF_PAGES_BRANCH,

  release: process.env.CF_PAGES_COMMIT_SHA,

  // Adjust this value in production, or use tracesSampler for greater control
  tracesSampleRate: 0.25,

  // Setting this option to true will print useful information to the console while you're setting up Sentry.
  debug: false,

  replaysOnErrorSampleRate: 1.0,

  // This sets the sample rate to be 10%. You may want this to be 100% while
  // in development and sample at a lower rate in production
  replaysSessionSampleRate: 0.1,

  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
  integrations: [
    new Sentry.Replay({
      // Additional Replay configuration goes in here, for example:
      maskAllText: true,
      blockAllMedia: true,
    }),
  ],
});

In next.config.js:

const sentryWebpackPluginOptions = {
  silent: true,
  org: "xxx",
  project: "xxx",
};

const sentryOptions = {
  widenClientFileUpload: true,
  hideSourceMaps: true,
  disableLogger: true,
};

module.exports =
  process.env.WITH_SENTRY === "true"
    ? withSentryConfig(nextConfig, sentryWebpackPluginOptions)
    : nextConfig;

Steps to Reproduce

1. Install Sentry in my existing nextjs project using `npx @sentry/wizard -i nextjs``
2. It creates the necessary client, edge and server configs.
3. Run Cloudflare Pages build locally using npx @cloudflare/next-on-pages@1 (same result remote)
4. See build errors

Also tried with the sentryOptions removed

Expected Result

Build should succeed, when Sentry is disabled (with the WITH_SENTRY = false env var) it works.

Actual Result

Result truncated as it repeats for every page in my project:

▲  - warn Compiled with warnings
▲  ./src/pages/_app.page.tsx
▲  Attempted import error: 'wrapAppGetInitialPropsWithSentry' is not exported from '@sentry/nextjs' (imported as 'Sentry').
▲  
▲  Import trace for requested module:
▲  ./src/pages/_app.page.tsx
▲  
▲  ./src/pages/_app.page.tsx
▲  Attempted import error: 'wrapDocumentGetInitialPropsWithSentry' is not exported from '@sentry/nextjs' (imported as 'Sentry').
▲  
▲  Import trace for requested module:
▲  ./src/pages/_app.page.tsx
▲  
▲  ./src/pages/_app.page.tsx
▲  Attempted import error: 'wrapErrorGetInitialPropsWithSentry' is not exported from '@sentry/nextjs' (imported as 'Sentry').
▲  
▲  Import trace for requested module:
▲  ./src/pages/_app.page.tsx
▲  
▲  ./src/pages/_app.page.tsx
▲  Attempted import error: 'wrapGetInitialPropsWithSentry' is not exported from '@sentry/nextjs' (imported as 'Sentry').
▲  
▲  Import trace for requested module:
▲  ./src/pages/_app.page.tsx
▲  
▲  ./src/pages/_app.page.tsx
▲  Attempted import error: 'wrapGetStaticPropsWithSentry' is not exported from '@sentry/nextjs' (imported as 'Sentry').
▲  
[ truncated ]
▲  ./node_modules/next/dist/esm/client/image-component.js
▲  Attempted import error: 'preload' is not exported from 'react-dom' (imported as 'preload').
▲  
▲  Import trace for requested module:
▲  ./node_modules/next/dist/esm/client/image-component.js
▲  ./node_modules/next/dist/esm/shared/lib/image-external.js
▲  ./node_modules/next/image.js
▲  ./src/components/shells/AppLayout.tsx
▲  ./src/pages/500.page.tsx
▲  - info Collecting page data...
▲  /Users/bjarnbronsveld/dev/code/nextjs/spectate-marketing-frontend/.next/server/pages/index.js:63
▲  `,default:rU});let rq=rH.default,rG=rq.getInitialProps,rV=rH.getStaticProps,rW=rH.getServerSideProps,rY={"/_app":S.wrapAppGetInitialPropsWithSentry,"/_document":S.wrapDocumentGetInitialPropsWithSentry,"/_error":S.wrapErrorGetInitialPropsWithSentry}["/_document"]||S.wrapGetInitialPropsWithSentry;"function"==typeof rG&&(rq.getInitialProps=rY(rG)),"function"==typeof rV&&S.wrapGetStaticPropsWithSentry(rV,"/_document"),"function"==typeof rW&&S.wrapGetServerSidePropsWithSentry(rW,"/_document"),n(3458);var rK=n(7294),rQ=n(5152),rJ=n(1664),rX=n(1163),r5=n(4298),r1=n(4970),r2=n(9332);let r4=e=>e.replace(/%3B/g,";"),r3=e=>{let t;let n=e.split("; ");for(let e of n){let n=e.split("="),r=r4(n[0]).replace(/%3D/g,"=");
[truncated]
▲  In order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function iy(e){return function(e){if(Array.isArray(e))return ij(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||iP(e)||function(){throw TypeError("Invalid attempt to spread non-iterable instance.
▲  In order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function iP(e,t){if(e){if("string"==typeof e)return ij(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?ij(e,t):void 0}}function ij(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}function iM(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=iP(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var r=0,i=function(){};return{s:i,n:function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}},e:function(e){throw e},f:i}}throw TypeError("Invalid attempt to iterate non-iterable instance.
▲  In order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,l=!0,o=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return l=e.done,e},e:function(e){o=!0,a=e},f:function(){try{l||null==n.return||n.return()}finally{if(o)throw a}}}}var i_={DEBUG:!1,LIB_VERSION:"1.75.3"};/**
▲                                                                                                                                                                                                                                                                                                                                                 ^
▲  
▲  TypeError: rY is not a function
▲  at 1311 (/Users/xxx/dev/code/nextjs/xxx-xxx-xxx/.
▲  > Build error occurred
▲  Error: Failed to collect page data for /
▲    at /Users/xxx/dev/code/nextjs/xxx-xxx-xxx/node_modules/next/dist/build/utils.js:1156:15
▲    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
▲  type: 'Error'
▲  }
▲  Error: Command "npm run build" exited with 1

[lforst]

Hi, thanks for writing in. We are aware of this issue. It happens when importing something from _app in an edge runtime context. We're in the process of fixing this.