With Next.js 12.0.1, Vercel can't handle getInitialProps on _app #30484

controversial · 2021-10-27T20:54:20Z

What version of Next.js are you using?

12.0.1

What version of Node.js are you using?

14.x

What browser are you using?

(all)

What operating system are you using?

(all)

How are you deploying your application?

Vercel

Describe the Bug

After upgrading my Next.js app to 12.0.1 (and making no other code changes) I'm running into an internal server error Cannot find module 'next/dist/server/get-page-files.js' on every single page. This error appears only on vercel, not in the next build/next start environment.

In my production app, the following error is raised:

Error log


[GET] /
15:45:01:88
c-c41c-4dab-8c25-66b58519db1f Version: $LATEST
2021-10-27T19:45:01.997Z	d3e98b2c-c41c-4dab-8c25-66b58519db1f	ERROR	Error: Cannot find module 'next/dist/server/get-page-files.js'
Require stack:
- /var/task/packages/(redacted)/.next/server/pages/_document.js
- /var/task/node_modules/next/dist/server/require.js
- /var/task/node_modules/next/dist/server/load-components.js
- /var/task/node_modules/next/dist/server/next-server.js
- /var/task/packages/(redacted)/___next_launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15)
    at Function.Module._load (internal/modules/cjs/loader.js:745:27)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Object.4140 (/var/task/packages/(redacted)/.next/server/pages/_document.js:67:18)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42)
    at Object.3721 (/var/task/packages/(redacted)/.next/server/chunks/331.js:451:21)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42)
    at Object.331 (/var/task/packages/(redacted)/.next/server/chunks/331.js:1120:18)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/packages/(redacted)/.next/server/pages/_document.js',
    '/var/task/node_modules/next/dist/server/require.js',
    '/var/task/node_modules/next/dist/server/load-components.js',
    '/var/task/node_modules/next/dist/server/next-server.js',
    '/var/task/packages/(redacted)/___next_launcher.js',
    '/var/runtime/UserFunction.js',
    '/var/runtime/index.js'
  ]
}
2021-10-27T19:45:01.997Z	d3e98b2c-c41c-4dab-8c25-66b58519db1f	ERROR	Error: Cannot find module 'next/dist/server/get-page-files.js'
Require stack:
- /var/task/packages/(redacted)/.next/server/pages/_document.js
- /var/task/node_modules/next/dist/server/require.js
- /var/task/node_modules/next/dist/server/load-components.js
- /var/task/node_modules/next/dist/server/next-server.js
- /var/task/packages/(redacted)/___next_launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15)
    at Function.Module._load (internal/modules/cjs/loader.js:745:27)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Object.4140 (/var/task/packages/(redacted)/.next/server/pages/_document.js:67:18)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42)
    at Object.3721 (/var/task/packages/(redacted)/.next/server/chunks/331.js:451:21)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42)
    at Object.331 (/var/task/packages/(redacted)/.next/server/chunks/331.js:1120:18)
    at __webpack_require__ (/var/task/packages/(redacted)/.next/server/webpack-runtime.js:25:42) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/packages/(redacted)/.next/server/pages/_document.js',
    '/var/task/node_modules/next/dist/server/require.js',
    '/var/task/node_modules/next/dist/server/load-components.js',
    '/var/task/node_modules/next/dist/server/next-server.js',
    '/var/task/packages/(redacted)/___next_launcher.js',
    '/var/runtime/UserFunction.js',
    '/var/runtime/index.js'
  ],
  page: '/'
}
RequestId: d3e98b2c-c41c-4dab-8c25-66b58519db1f Error: Runtime exited with error: exit status 1
Runtime.ExitError

In the MCVE I'm attaching, the import error is slightly different (Cannot find module 'react/jsx-runtime') but the error arises from the same place

Error log


2021-10-27T20:43:38.373Z	6819abce-0ec9-41ef-afe0-9f880c7c66b4	ERROR	Error: Cannot find module 'react/jsx-runtime'
Require stack:
- /var/task/.next/server/pages/_document.js
- /var/task/node_modules/next/dist/server/require.js
- /var/task/node_modules/next/dist/server/load-components.js
- /var/task/node_modules/next/dist/server/next-server.js
- /var/task/___next_launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15)
    at Function.Module._load (internal/modules/cjs/loader.js:745:27)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Object.997 (/var/task/.next/server/pages/_document.js:103:18)
    at __webpack_require__ (/var/task/.next/server/webpack-runtime.js:25:42)
    at Object.553 (/var/task/.next/server/pages/_document.js:15:75)
    at __webpack_require__ (/var/task/.next/server/webpack-runtime.js:25:42)
    at __webpack_exec__ (/var/task/.next/server/pages/_document.js:113:39)
    at /var/task/.next/server/pages/_document.js:114:66 {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/.next/server/pages/_document.js',
    '/var/task/node_modules/next/dist/server/require.js',
    '/var/task/node_modules/next/dist/server/load-components.js',
    '/var/task/node_modules/next/dist/server/next-server.js',
    '/var/task/___next_launcher.js',
    '/var/runtime/UserFunction.js',
    '/var/runtime/index.js'
  ]
}
2021-10-27T20:43:38.382Z	6819abce-0ec9-41ef-afe0-9f880c7c66b4	ERROR	Error: Cannot find module 'react/jsx-runtime'
Require stack:
- /var/task/.next/server/pages/_document.js
- /var/task/node_modules/next/dist/server/require.js
- /var/task/node_modules/next/dist/server/load-components.js
- /var/task/node_modules/next/dist/server/next-server.js
- /var/task/___next_launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15)
    at Function.Module._load (internal/modules/cjs/loader.js:745:27)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Object.997 (/var/task/.next/server/pages/_document.js:103:18)
    at __webpack_require__ (/var/task/.next/server/webpack-runtime.js:25:42)
    at Object.553 (/var/task/.next/server/pages/_document.js:15:75)
    at __webpack_require__ (/var/task/.next/server/webpack-runtime.js:25:42)
    at __webpack_exec__ (/var/task/.next/server/pages/_document.js:113:39)
    at /var/task/.next/server/pages/_document.js:114:66 {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/.next/server/pages/_document.js',
    '/var/task/node_modules/next/dist/server/require.js',
    '/var/task/node_modules/next/dist/server/load-components.js',
    '/var/task/node_modules/next/dist/server/next-server.js',
    '/var/task/___next_launcher.js',
    '/var/runtime/UserFunction.js',
    '/var/runtime/index.js'
  ],
  page: '/'
}
RequestId: 6819abce-0ec9-41ef-afe0-9f880c7c66b4 Error: Runtime exited with error: exit status 1
Runtime.ExitError

In my production app, as well as in the simplest Next.js app I can come up with, this error appears as soon as I add getInitialProps to _app and disappears as soon as I remove it.

Expected Behavior

Adding getInitialProps to _app, closely following the documentation works on Vercel as it does in the next start server environment.

To Reproduce

First, Create the following three files in any folder:

`pages/index.jsx`

import React from 'react';

export default function Home() {
  return (
    <div>
      <h1>Home</h1>
    </div>
  );
}

`pages/_app`

import React from 'react';

import NextApp from 'next/app';

function App({ Component, pageProps }) {
  return (
    <div id="app">
      <Component {...pageProps} />
    </div>
  );
}

App.getInitialProps = async function getInitialProps(appContext) {
  const appProps = await NextApp.getInitialProps(appContext);
  return {
    ...appProps,
    pageProps: {
      ...appProps.pageProps,
      hello: 'world',
    },
  };
};

export default App;

`package.json`

{
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "^12.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  }
}

Next, run npm install && npm run build && npm run start. Observe that the app loads properly.

Finally, deploy the app to Vercel. Observe that every page crashes with a 500 Internal Server Error, and the serverless function logs show an error similar to the above.

The text was updated successfully, but these errors were encountered:

juancamiloqhz · 2021-10-27T22:39:36Z

I'm having this exact same issue.

controversial · 2021-10-29T03:22:05Z

Related: #30572, #30561 - can be fixed for now using { outputFileTracing: false }

timneutkens · 2021-10-29T12:57:07Z

outputFileTracing: false, just to make sure people use the right name for it as optimizeFileTracing is not an option and as such will not change behavior 👍

ijjk · 2021-10-29T23:30:16Z

Hi, this has been updated in v12.0.2-canary.11 of Next.js, please update and remove outputFileTracing: false from your next.config.js!

controversial · 2021-11-02T21:49:13Z

@timneutkens Sorry about that! Edited to fix the typo in my original comment.

timneutkens · 2021-11-03T08:25:37Z

12.0.2 is out now, could you try it @controversial!

controversial · 2021-11-06T14:26:36Z

Yes, the repro I provided is fixed now on the latest Next (12.0.3). Thanks so much!

balazsorban44 · 2022-01-27T11:05:34Z

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

controversial added the bug Issue was opened via the bug report template. label Oct 27, 2021

controversial mentioned this issue Oct 28, 2021

Vercel can't render 'fallback' pages using getStaticPaths on Next.js 12 #30572

Closed

timneutkens added kind: bug Output Related to the the output configuration option. and removed bug Issue was opened via the bug report template. labels Oct 29, 2021

timneutkens added this to the 12.0.x milestone Oct 29, 2021

ijjk mentioned this issue Oct 29, 2021

Update output tracing to do separate passes #30637

Merged

10 tasks

styfle modified the milestones: 12.0.x, 12.0.4 Nov 5, 2021

controversial closed this as completed Nov 6, 2021

PH4NTOMiki mentioned this issue Jan 19, 2022

Pages show 500 error on Vercel, on Netlify they work #33459

Closed

vercel locked as resolved and limited conversation to collaborators Jan 27, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

With Next.js 12.0.1, Vercel can't handle getInitialProps on _app #30484

With Next.js 12.0.1, Vercel can't handle getInitialProps on _app #30484

controversial commented Oct 27, 2021

juancamiloqhz commented Oct 27, 2021 •

edited

Loading

controversial commented Oct 29, 2021 •

edited

Loading

timneutkens commented Oct 29, 2021

ijjk commented Oct 29, 2021 •

edited

Loading

controversial commented Nov 2, 2021

timneutkens commented Nov 3, 2021

controversial commented Nov 6, 2021

balazsorban44 commented Jan 27, 2022

With Next.js 12.0.1, Vercel can't handle getInitialProps on _app #30484

With Next.js 12.0.1, Vercel can't handle getInitialProps on _app #30484

Comments

controversial commented Oct 27, 2021

What version of Next.js are you using?

What version of Node.js are you using?

What browser are you using?

What operating system are you using?

How are you deploying your application?

Describe the Bug

Expected Behavior

To Reproduce

pages/index.jsx

pages/_app

package.json

juancamiloqhz commented Oct 27, 2021 • edited Loading

controversial commented Oct 29, 2021 • edited Loading

timneutkens commented Oct 29, 2021

ijjk commented Oct 29, 2021 • edited Loading

controversial commented Nov 2, 2021

timneutkens commented Nov 3, 2021

controversial commented Nov 6, 2021

balazsorban44 commented Jan 27, 2022

`pages/index.jsx`

`pages/_app`

`package.json`

juancamiloqhz commented Oct 27, 2021 •

edited

Loading

controversial commented Oct 29, 2021 •

edited

Loading

ijjk commented Oct 29, 2021 •

edited

Loading