10

npm install next react react-dom And running Node.js v12

Created most simple pages/index.tsx

export default function PageHome(props) {
  return <>Hello World!</>
}

(I also had TypeScript configured as per Next.js instructions but not sure if that's making a difference.)

C:\GitHub\reproduce-nextjs-webpack5-error>npm run dev
...
event - compiled successfully
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: Can't resolve 'fsevents' in 'C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar'
<w> while resolving 'fsevents' in C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar to a directory
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: Can't resolve 'fsevents' in 'C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar'
<w> while resolving 'fsevents' in C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar to a directory

Self-answered solution below for future readers.

700 Software
  • 85,281
  • 83
  • 234
  • 341

3 Answers3

13

  1. Upgrade Node.js

  2. Delete package-lock.json and node_modules

  3. Run npm install again

  4. It works

    • Apparently something doesn't install when you run with an older Node.js version.

    • My package.json looked like

      {
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "^10.1.3",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "@types/react": "^17.0.3",
    "typescript": "^4.2.4"
  }
}

    • The same package.json will install slightly differently switching from Node.js v12 to Node.js v15 as I just observed. This is why you have to complete not just step 1, but also steps 2 & 3.

Before:

C:\GitHub\reproduce-nextjs-webpack5-error>node --version
v12.4.0

C:\GitHub\reproduce-nextjs-webpack5-error>npm run dev

> @ dev C:\GitHub\reproduce-nextjs-webpack5-error
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Using webpack 5. Reason: future.webpack5 option enabled https://nextjs.org/docs/messages/webpack5
event - compiled successfully
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: Can't resolve 'fsevents' in 'C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar'
<w> while resolving 'fsevents' in C:\GitHub\reproduce-nextjs-webpack5-error\node_modules\next\node_modules\chokidar to a directory

After:

C:\GitHub\reproduce-nextjs-webpack5-error>node --version
v15.14.0

C:\GitHub\reproduce-nextjs-webpack5-error>npm run dev

> dev
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Using webpack 5. Reason: future.webpack5 option enabled https://nextjs.org/docs/messages/webpack5
event - compiled successfully
event - build page: /
wait  - compiling...
event - compiled successfully

Yay! No warnings!

While there are comments below about future changes in nextjs@canary, the above examples worked for me with versions listed.

TylerH
  • 20,799
  • 66
  • 75
  • 101
700 Software
  • 85,281
  • 83
  • 234
  • 341
  • 1
    Actually, they said this is only an issue in Next.js v10.1.3. As of this writing, nextjs@canary has a fix. – 700 Software Apr 14 '21 at 14:37
  • Which one of the nextjs@canary? – Barnee Apr 22 '21 at 12:10
  • FYI, this fix didn't work for me with `"next": "^10.1.3",` but node v14. Do you have a link to an issue in the NextJS repo? – iamyojimbo Apr 22 '21 at 13:02
  • 1
    Their comment was here: https://github.com/vercel/next.js/pull/24037#event-4592124968 _"The fsevents error has been solved on `next@canary` already. Please try upgrading."_ – 700 Software Apr 22 '21 at 16:07
4

Delete the .next folder and re-run npm run dev. This happens when your system shuts down unexpectedly without saving.

some-user
  • 3,888
  • 5
  • 19
  • 43
Stephen Thomas
  • 41
  • 3
1

I have resolved this problem by killing all node processes on my production server.

Robert Gurgul
  • 111
  • 1
  • 3