Cannot read properties of undefined (reading 'getInitialProps')

[silentim]

Verify canary release

• I verified that the issue exists in Next.js canary release

Provide environment information

next: 12.1.1-12.1.6-canary.2
react: 17.0.2 or 18.0.0
node: 14.19.1
system: windows

What browser are you using? (if relevant)

chrome 100.0.4896.88

How are you deploying your application? (if relevant)

next start

Describe the Bug

Expected Behavior

no error in console and display page content

To Reproduce

//app.ts

const MyApp = ({ Component, pageProps }: AppProps) => {
    return <Component {...pageProps} />;
};

MyApp.getInitialProps = async (appContext: AppContext) => {
    const some = await fetch('....');

    const appProps = await App.getInitialProps(appContext);
    return { ...appProps, pageProps: { ...appProps.pageProps, some } };
};

export default MyApp;

//index.ts

export default function Home(){
    return (
        <div>some text</div>
    )
}

export const getStaticProps: GetStaticProps = async () => {
    return { props: { } };
}

Then npm run build, everything is ok and built successfully.
Now npm run start, get error like this in console (see image attached) and there is nothing displaying in browser, just blank:

A client-side exception has occurred, see here for more info: https://nextjs.org/docs/messages/client-side-exception-occurred
Error rendering page: TypeError: Cannot read properties of undefined (reading 'getInitialProps')

No error if next 12.1.0 and more lower version.

[silentim]

I found, if some function uses 'zlib' module in app.ts, and swcMinify=true in next.config.js, this error comes like above; If swcMinify=false, page is ok and no error. So then zlib will not be supported after next 12.1.0?

[kdy1]

No, it's a bug of swc minifier. As there are so many minification rules, there are some bugs.
It's a huge project.

I'll add this to my private task list

[C-E-Rios]

Seeing the same. Setting swcMinify=false as recommended by @silentim fixed it.

[KatFishSnake]

@silentim 🙏 thank you, fixed my issues with opensea-js failing to build nextjs on vercel, also @C-E-Rios swcMinify=false is the solution

[kdy1]

Is this issue still the case?
As there's no repro it's too hard for me to verify it

[davidhanlonJCM]

Is this fixed in next 12.3?

[kdy1]

@davidhanlonJCM I think so, but I can't verify as there's no input nor repro case.

[davidhanlonJCM]

@kdy1 upgrading to next 12.3 appears to have solved the issue for me. In my case the issue appeared when using next 12.1 with swcMinify:true in the next.config file. It only showed up when running a full build or deployed to a vercel domain

[DonikaV]

in version v13, if I run production (npm run build && npm run start) version I get these errors. if dev - all fine :|

[kdy1]

@DonikaV Can you provide a repro?

[rossignolli]

i've been getting the same errors in my sentry report.

using next 12.3.1

I've already tried to disable swcMinify.

i use getInitialProps once only in _document.js to setup styled-components basead on with-styled-components

import Document, { DocumentContext } from 'next/document'
import { ServerStyleSheet } from 'styled-components'

export default class MyDocument extends Document {
  static async getInitialProps(ctx: DocumentContext) {
    const sheet = new ServerStyleSheet()
    const originalRenderPage = ctx.renderPage

    try {
      ctx.renderPage = () =>
        originalRenderPage({
          enhanceApp: (App) => (props) =>
            sheet.collectStyles(<App {...props} />),
        })

      const initialProps = await Document.getInitialProps(ctx)
      return {
        ...initialProps,
        styles: [initialProps.styles, sheet.getStyleElement()],
      }
    } finally {
      sheet.seal()
    }
  }
}

My sentry report:

TypeError
Cannot read property 'getInitialProps' of undefined

./node_modules/next/dist/shared/lib/utils.js in call at line 66:18

                throw new Error(message);
            }
        }
        // when called from _app `ctx` is nested in `ctx`
        const res = ctx.res || ctx.ctx && ctx.ctx.res;
        if (!App.getInitialProps) {
            if (ctx.ctx && ctx.Component) {
                // @ts-ignore pageProps default
                return {
                    pageProps: yield loadGetInitialProps(ctx.Component, ctx.ctx)
                };




ReferenceError: globalThis is not defined
console
A client-side exception has occurred, see here for more info: 

Consequently seems like some users are getting and others not. any ideas?

[kdy1]

@rossignolli Can you try 12 canary?

[DonikaV]

@DonikaV Can you provide a repro?

No, the problem that I don't use anywhere any functions like getInitiallProps. I only use env vars. maybe it because of that, but in version 12* all works fine. In 13 no :|

[rossignolli]

@rossignolli Can you try 12 canary?

Same :/

[kdy1]

Oh if disabling swcMinify does not work it's a different issue

[Jay-flow]

It still occurs in the following environments.

• "@sentry/nextjs": "^7.34.0"
• "next": "13.2.4",

I tried upgrading to the latest version of @sentry/nextjs 7.53, but it didn't help much.

I don't think we've figured out exactly what the problem is yet.
Is there anyone who can clarify why this issue occurs and how to solve it?
If anyone leave a comment, it'll be a big help to everyone. Thanks.

[jt561]

Is anyone having the same issue with TRPC as a wrapper around their app?

[iscekic]

Any update? Seems like a simple ?. as this comment says: #36221 (comment)

[jt561]

Turns out my issue was related to import statements. I am using a mono repo which had a lot of circular dependencies causing the build to have problems but everything works fine after creating a dependency graph and moving things around

[korac]

Leaving this comment for all those still experiencing the issue.

Same as stated in this comment, I started to experience the issue right after adding Sentry to my Next v12 project.
The issue started to appear with @sentry/nextjs: 7.17.1.

Changelog report for v7.17.1 lead me to this PR and specifically this line:

test: new RegExp(`^${escapeStringForRegex(pagesDirectory)}.*\\.(${pageExtensionRegex})$`),

This change was significant in my case since my project contained both /pages and /pages-components folders. Previously, given regex was matching only /pages folder but the new change included /pages-components as well.

Not completely familiar with how sentry boostraps in Next but renaming my /pages-components folder into something else (that doesn't start with pages) resolved the issue in my case.

ps. after this renaming, my projects is ok even with latest @sentry/nextjs version 7.57.0.

[surbina]

Not completely familiar with how sentry boostraps in Next but renaming my /pages-components folder into something else (that doesn't start with pages) resolved the issue in my case.

I also experienced this, but my project contained a /pagesComponents folder. Renaming the folder to something else did the trick. Thanks @korac.

[frattaro]

This started in one of our projects. I found a colleague had added (most likely auto-added on accident):

import { NextRouter } from "next/router"

removing that fixed it

[lsaavedr]

In my case the problem is fixed defining an export default in all .tsx files

[kevinrobert3]

@dlvx , @JClackett and @rossignolli do any of you have an update on this or a workaround? My issue affects ios devices on browser "Mobile Safari UI/WKWebView"

[kevinrobert3]

Turns out I needed just enough time and headache to troubleshoot this.
For those that this affects iOS users, you need to debug on your phone (iOS), run local, and connect your phone browser.
All that same address and same network stuff.
Then the error that usually occurs (in production) will be thrown, by nextjs. This will be easier for you to debug now since you even get the line it occurs from.
For me, it was

1. A service worker for messaging that was not registering and throwing an error
2. A Firebase messaging error since I guess (firebase messaging) was not yet supported by iOS devices then and on old browsers

[samcx]

Hi everyone,

I will be moving this to Discussions since there seems to be a variety of solutions that remedied this issue and a variety of issues that was/is causing this issue.

Thank you for all the different solutions and reports!

If the issue continues to arise, I encourage folks to create a separate bug report for their issue.

[matthewbae]

Was this suggestion taken up in later versions of next? I don't see any downsides.

In my case, it's happening in Safari based on my sentry reports. But, I can't repro it in Safari myself. Does anyone have tips in getting this to reproduce? I'll try version bumps, but based on this discussion, there seems to be a lot of reasons why this occurs across all versions of sentry and next.

[robyn3choi]

This is happening to some of our users on Windows and Android. We're on next v14.2.1 and @sentry/nextjs 7.110.1

[LifeGains]

Getting this same error in 2024: "TypeError: Cannot read properties of undefined (reading 'getInitialProps')"

[kdy1]

Are you using canary? If you can reproduce it with the canary, can you provide a reproduction so I can fix it?

[cpramshad]

I'm also getting this issue in my Sentry reports.
Its happening in Mobile Safari browser, but unable to replicate this issue when tried manually.
Any potential fix that I should try?
Also this issue is related to which library, "next" or "@sentry/nextjs" ?

"next": "^14.2.5",
"@sentry/nextjs": "^7.109.0",

TypeError ?(chunks/main)
Ongoing
Level: Error
Unhandled
undefined is not an object (evaluating 'e.getInitialProps')

Its happening at this line the chunk file. Here e is undefined.
async function f(e,t){let r=t.res||t.ctx&&t.ctx.res;if(!e.getInitialProps)return t.ctx&&t.Component?{pageProps:await f(t.Component,t.ctx)}:

Sentry report: