search

vercel / next.js

The React Framework
https://nextjs.org
MIT License
127.11k stars 27.01k forks source link

Adding an _app.js file in v10.0.4 causes @babel/runtime error #20440

Closed cassidoo closed 3 years ago

cassidoo commented 3 years ago

Bug report

Describe the bug

I have a basic Next.js v10.0.4 application, and when I add an _app.js file, I get this error:

Module not found: Can't resolve '@babel/runtime/helpers/esm/defineProperty'

When I downgrade to v10.0.3, the error goes away.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

  1. Run a Next.js project, version 10.0.4 
    // package.json
"dependencies": {
"next": "10.0.4",
"react": "17.0.1",
"react-dom": "17.0.1",
}
  2. Add an _app.js file: 
    
function Application({ Component, pageProps }) {
return <Component {...pageProps} />
}

export default Application

3. See error:

error - ./pages/_app.js Module not found: Can't resolve '@babel/runtime/helpers/esm/defineProperty' in '/.../pages' Error: Cannot find module '/.../.next/build-manifest.json' Require stack:

Expected behavior

I expect the application to run without any user-facing changes.

System information

Additional context

Specifically I was trying to update this repo and a couple others, but I haven't pushed any yet because of this, and all of them have had this issue. I deleted node_modules before updating the Next.js version.

I tried doing the following to see if that would change anything, but no dice:

npm i @babel/runtime@7.12.1
npm i @babel/runtime@latest
npm r @babel/runtime

Update: I downgraded to Next.js v10.0.3, and then back to v10.0.4, and now it is working just fine again!

nobu222 commented 3 years ago

i have same problems..

Error message:

Module not found: Can't resolve '/Users/n-futagami/Project/hayaben/hayaben-next/node_modules/next/node_modules/@babel/runtime/helpers/esm/extends'

@babel packages not found in node_modules/next/node_modules. but, node_modules/@babel/... is exists.

What is the solution?

tremby commented 3 years ago

Meanwhile, my error was this:

ModuleNotFoundError: Module not found: Error: Can't resolve '<...>/node_modules/next/node_modules/@babel/runtime/helpers/construct'

I have also seen

ModuleNotFoundError: Module not found: Error: Can't resolve '<...>/node_modules/next/node_modules/@babel/runtime/helpers/esm/defineProperty'

In both of these cases, the nonsensical downgrade/upgrade of @babel/runtime Cassidy mentioned above is what works for me; that was my suggestion to her on the Next Discord channel earlier today. @nobu222, you should give that a try and see if it clears your issue up.

I have no idea why it works; I end up with the same version of @babel/runtime I started with, yet I can reproducibly cause this error (by deleting package_lock.json then running npm i) and fix it again via those commands, at least within my project. I haven't been able to make a minimal breaking case.

In particular, with a bit more detail, and an extra step just for clarity:

Maybe it won't work for you though -- it didn't work for Cassidy.

nobu222 commented 3 years ago

@tremby Thanks for the feedback! It's working as expected.

i tried your steps. ( i'm using yarn, not npm)

Successed only step2 (using @babel/runtime@7.12.1). i decided to use old version(7.12.1) in my project.

Timer commented 3 years ago

I'm not able to reproduce this, however, I have a feeling it's a bug with npm that's causing this.

Can you try to delete both package-lock.json and node_modules and running an install again?

cassidoo commented 3 years ago

I'm not able to reproduce this, however, I have a feeling it's a bug with npm that's causing this.

Can you try to delete both package-lock.json and node_modules and running an install again?

@Timer my update line was tiny so you might have missed it, but I fixed it this way:

Update: I downgraded to Next.js v10.0.3, and then back to v10.0.4, and now it is working just fine again!

It's a weird one. I did try the package-lock.json and node_modules thing first, and it didn't work.

Timer commented 3 years ago

Oh interesting, yeah I must've misread that! Our hands are a bit tied when it comes to npm bugs.

However, this PR may prevent this specific instance: https://github.com/vercel/next.js/pull/19538 There's no guarantee a second error wouldn't of popped up. 😞

If you have the original package-lock.json, it might be worth sending it to the npm support team and ask them to analyze it to fix the bug on upgrade.

lbssousa commented 3 years ago

I'm having this same exact problem with any Next version since 10.0.5. The only workaround I've found is downgrading Next to version 10.0.4.

rommyarb commented 3 years ago

I also have the same problem. My workaround is to delete yarn.lock file, delete node_modules directory, and reinstall all dependency (yarn / yarn install). Boom, errors are gone.

demfabris commented 3 years ago

Same issue, only solution was to downgrade Next to 10.0.4

christian-fuss commented 3 years ago

I had the same problem after cleaning up some unused dependencies. I tried upgrading everything, cleaning the yarn.lock but nothing worked. After enabling webpack5, the error is gone.

See https://nextjs.org/docs/messages/webpack5 for more info.

dickwyn commented 3 years ago

Has a similar issue happen on my jenkins build job, it built fine for me locally. (next@10.1.3)

ModuleNotFoundError: Module not found: Error: Can't resolve '<BUILD-DIRECTORY>/node_modules/next/node_modules/@babel/runtime/helpers/construct' in '<BUILD-DIRECTORY>/node_modules/next/dist/client'

enabling webpack5 on my next.config.js solved it for me. hats off to @christian-fuss 

future: {
  webpack5: true,
},
balazsorban44 commented 2 years ago

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.