gpt4 book ai didi

next.js - 将 Next.js v10.1.13 更新到 webpack5 时,收到警告 Can't resolve 'fsevents' in chokidar

转载 作者:行者123 更新时间:2023-12-04 11:11:36 30 4
gpt4 key购买 nike

npm install next react react-dom并运行 Node.js v12
创建最简单 pages/index.tsx

export default function PageHome(props) {
return <>Hello World!</>
}
(我还按照 Next.js instructions 配置了 TypeScript,但不确定这是否有所作为。)
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
下面为 future 的读者提供自我回答的解决方案。

最佳答案

  • 升级 Node.js
  • 删除 package-lock.jsonnode_modules
  • 运行 npm install再次
  • 有用
  • 显然,当您使用较旧的 Node.js 版本运行时,不会安装某些东西。
  • 我的 package.json看起来像
    {
    "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"
    }
    }
  • package.json正如我刚刚观察到的那样,从 Node.js v12 切换到 Node.js v15 的安装略有不同。这就是为什么您不仅要完成第 1 步,还要完成第 2 步和第 3 步。


  • 前:
    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

    后:
    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
    好极了!没有警告!
    虽然下面有关于 nextjs@canary 中 future 变化的评论,上面的例子对我有用,列出了版本。

    关于next.js - 将 Next.js v10.1.13 更新到 webpack5 时,收到警告 Can't resolve 'fsevents' in chokidar,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67082806/

    30 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com