Two NextJS builds failing with error "Cannot find module 'next/app'"

I’m having a problem with two of my NextJS sites. They fail on the build process with this error message:

...
9:12:14 AM: ./src/pages/_app.tsx:2:29
9:12:14 AM: Type error: Cannot find module 'next/app' or its corresponding type declarations.
9:12:14 AM:   1 | import '@/styles/globals.css'
9:12:14 AM: > 2 | import type {AppProps} from 'next/app'
...

I’m also noticing that both sites are giving me this warning:

...
9:12:08 AM: ❯ Using Next.js Runtime - v4.41.3
9:12:08 AM: ​
9:12:08 AM: ❯ Outdated plugins
9:12:08 AM:    - @netlify/plugin-nextjs@4.41.3: latest version is 5.3.3
9:12:08 AM:      To upgrade this plugin, please uninstall and re-install it from the Netlify plugins directory (https://app.netlify.com/plugins)
...

My package.json has this plugin installed with the latest version:

...
"dependencies": {
  ...
  "@netlify/plugin-nextjs": "^5.4.0",
  ...
}
...

Can you assist me with upgrading the plugins for these sites and for resolving this build issue? I have other NextJS sites that build just fine. Also, both projects build just fine locally.

Thank you for your help.


Site Names:

  • cbc-countdown (70a7e344-0863-4425-85ca-21d2dc3bd0e1)
  • smiletract (1e5b6d92-0764-4b0f-a580-5f3119e10043)

Build Log:

9:11:17 AM: Waiting for other deploys from your team to complete. Check the queue: https://app.netlify.com/teams/candeegenerations/builds
9:11:42 AM: build-image version: 006dca901dab83234b4881f914ac1a189ff41daa (focal)
9:11:42 AM: buildbot version: 85b96580a20a4d1c8162f558cac1ba041b0848da
9:11:42 AM: Fetching cached dependencies
9:11:42 AM: Starting to download cache of 116.0MB
9:11:45 AM: Finished downloading cache in 2.964s
9:11:45 AM: Starting to extract cache
9:11:46 AM: Finished extracting cache in 1.582s
9:11:46 AM: Finished fetching cache in 4.593s
9:11:46 AM: Starting to prepare the repo for build
9:11:47 AM: Preparing Git Reference refs/heads/main
9:11:48 AM: Starting to install dependencies
9:11:48 AM: Python version set to 3.8
9:11:49 AM: Attempting Ruby version 2.7.2, read from environment
9:11:49 AM: Using Ruby version 2.7.2
9:11:50 AM: Started restoring cached go cache
9:11:50 AM: Finished restoring cached go cache
9:11:51 AM: go version go1.19.13 linux/amd64
9:11:52 AM: Using PHP version 8.0
9:11:53 AM: Started restoring cached Node.js version
9:11:55 AM: Finished restoring cached Node.js version
9:11:56 AM: v18.20.3 is already installed.
9:11:56 AM: Now using node v18.20.3 (npm v10.7.0)
9:11:56 AM: Enabling Node.js Corepack
9:11:56 AM: Started restoring cached build plugins
9:11:56 AM: Finished restoring cached build plugins
9:11:56 AM: Started restoring cached corepack dependencies
9:11:56 AM: Finished restoring cached corepack dependencies
9:11:56 AM: Started restoring cached yarn cache
9:11:56 AM: Finished restoring cached yarn cache
9:11:56 AM: ! Corepack is about to download https://repo.yarnpkg.com/4.2.2/packages/yarnpkg-cli/bin/yarn.js
9:11:56 AM: Installing Yarn version 1.22.19
9:11:57 AM: Preparing yarn@1.22.19 for immediate activation...
9:11:57 AM: No yarn workspaces detected
9:11:57 AM: Started restoring cached node modules
9:11:57 AM: Finished restoring cached node modules
9:11:57 AM: Installing npm packages using Yarn version 4.2.2
9:11:57 AM: ➤ YN0000: · Yarn 4.2.2
9:11:57 AM: ➤ YN0000: ┌ Resolution step
9:11:58 AM: ➤ YN0000: └ Completed
9:11:58 AM: ➤ YN0000: ┌ Post-resolution validation
9:11:58 AM: ➤ YN0060: │ eslint is listed by your project with version 9.5.0, which doesn't satisfy what typescript-eslint (pc1652) and other dependencies request (^8.56.0).
➤ YN0086: │ Some peer dependencies are incorrectly met; run yarn explain peer-requirements <hash> for details, where <hash> is the six-letter p-prefixed code.
9:11:58 AM: ➤ YN0000: └ Completed
9:11:58 AM: ➤ YN0000: ┌ Fetch step
9:12:03 AM: ➤ YN0066: │ typescript@patch:typescript@npm%3A5.5.2#optional!builtin<compat/typescript>::version=5.5.2&hash=b45daf: Cannot apply hunk #11
9:12:04 AM: ➤ YN0013: │ 566 packages were added to the project (+ 350.7 MiB).
9:12:04 AM: ➤ YN0000: └ Completed in 6s 86ms
9:12:04 AM: ➤ YN0000: ┌ Link step
9:12:04 AM: ➤ YN0031: │ One or more node_modules have been detected and will be removed. This operation may take some time.
9:12:04 AM: ➤ YN0000: │ ESM support for PnP uses the experimental loader API and is therefore experimental
9:12:05 AM: ➤ YN0007: │ cbc-countdown@workspace:. must be built because it never has been before or the last one failed
9:12:05 AM: ➤ YN0000: └ Completed in 1s 63ms
9:12:05 AM: ➤ YN0000: · Done with warnings in 7s 382ms
9:12:05 AM: npm packages installed using Yarn
9:12:06 AM: Successfully installed dependencies
9:12:06 AM: Starting build script
9:12:07 AM: Detected 1 framework(s)
9:12:07 AM: "next" at version "14.2.4"
9:12:07 AM: Section completed: initializing
9:12:08 AM: ​
9:12:08 AM: Netlify Build                                                 
9:12:08 AM: ────────────────────────────────────────────────────────────────
9:12:08 AM: ​
9:12:08 AM: ❯ Version
9:12:08 AM:   @netlify/build 29.50.0
9:12:08 AM: ​
9:12:08 AM: ❯ Flags
9:12:08 AM:   baseRelDir: true
9:12:08 AM:   buildId: 667eb6748ae0ff0008bfbbac
9:12:08 AM:   deployId: 667eb6758ae0ff0008bfbbae
9:12:08 AM: ​
9:12:08 AM: ❯ Current directory
9:12:08 AM:   /opt/build/repo
9:12:08 AM: ​
9:12:08 AM: ❯ Config file
9:12:08 AM:   No config file was defined: using default values.
9:12:08 AM: ​
9:12:08 AM: ❯ Context
9:12:08 AM:   production
9:12:08 AM: ​
9:12:08 AM: ❯ Using Next.js Runtime - v4.41.3
9:12:08 AM: ​
9:12:08 AM: ❯ Outdated plugins
9:12:08 AM:    - @netlify/plugin-nextjs@4.41.3: latest version is 5.3.3
9:12:08 AM:      To upgrade this plugin, please uninstall and re-install it from the Netlify plugins directory (https://app.netlify.com/plugins)
9:12:11 AM: Next.js cache restored.
9:12:11 AM: ​
9:12:11 AM: Build command from Netlify app                                
9:12:11 AM: ────────────────────────────────────────────────────────────────
9:12:11 AM: ​
9:12:11 AM: $ yarn run build
9:12:13 AM:   ▲ Next.js 14.2.4
9:12:13 AM:   - Experiments (use with caution):
9:12:13 AM:     · cpus
9:12:13 AM:    Linting and checking validity of types ...
9:12:14 AM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
9:12:14 AM: Failed to compile.
9:12:14 AM: 
9:12:14 AM: ./src/pages/_app.tsx:2:29
9:12:14 AM: Type error: Cannot find module 'next/app' or its corresponding type declarations.
9:12:14 AM:   1 | import '@/styles/globals.css'
9:12:14 AM: > 2 | import type {AppProps} from 'next/app'
9:12:14 AM:     |                             ^
9:12:14 AM:   3 |
9:12:14 AM:   4 | export default function App({Component}: AppProps) {
9:12:14 AM:   5 |   return <Component />
9:12:14 AM: ​
9:12:14 AM: "build.command" failed                                        
9:12:14 AM: ────────────────────────────────────────────────────────────────
9:12:14 AM: ​
9:12:14 AM:   Error message
9:12:14 AM:   Command failed with exit code 1: yarn run build (https://ntl.fyi/exit-code-1)
9:12:14 AM: ​
9:12:14 AM:   Error location
9:12:14 AM:   In Build command from Netlify app:
9:12:14 AM:   yarn run build
9:12:14 AM: ​
9:12:14 AM:   Resolved config
9:12:14 AM:   build:
9:12:14 AM:     command: yarn run build
9:12:14 AM:     commandOrigin: ui
9:12:14 AM:     environment:
9:12:14 AM:       - NEXT_PRIVATE_TARGET
9:12:14 AM:     publish: /opt/build/repo/.next
9:12:14 AM:     publishOrigin: ui
9:12:14 AM:   plugins:
9:12:14 AM:     - inputs: {}
9:12:14 AM:       origin: ui
9:12:14 AM:       package: '@netlify/plugin-nextjs'
9:12:14 AM: Build failed due to a user error: Build script returned non-zero exit code: 2
9:12:14 AM: Failing build: Failed to build site
9:12:15 AM: Finished processing build request in 33.121s

Are you able to clone your repo to another folder and run the build (next build)?

That helped. It was a missing yarn yaml file