next.js 未找到模块:无法解析'fs',找不到webpack.js.js,npm错误!缺少脚本:“弹射”

rjzwgtxy  于 2023-10-18  发布在  Webpack
关注(0)|答案(1)|浏览(525)

我正在尝试用next.js开发我的第一个网络应用程序。这是我第一次使用webdev(我来自固件工程背景)。我试图从我的next.js应用程序设置对mongodb数据库的访问,但我得到了下面描述的错误。
我不明白,因为应用程序是正确的建设之前,添加mangodb管理和错误似乎是有关的一个库,我没有安装之间,所以它必须已经在这里。
当然,我真的很想一个解决方案,但如果你也能解释这一切是什么,这将是真棒。我不得不承认这对我来说很模糊
谢谢
运行npm run dev时出现以下错误:

○ Compiling / ...
 ⨯ ./node_modules/bindings/bindings.js:5:0
Module not found: Can't resolve 'fs'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/mongodb-client-encryption/lib/index.js
./node_modules/mongodb/lib/deps.js
./node_modules/mongodb/lib/client-side-encryption/client_encryption.js
./node_modules/mongodb/lib/index.js
./lib/db.js
./pages/index.js
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: ENOENT: no such file or directory, rename '/Users/camille/Documents/NextjsTraining/motsderobes/.next/cache/webpack/client-development-fallback/0.pack.gz_' -> '/Users/camille/Documents/NextjsTraining/motsderobes/.next/cache/webpack/client-development-fallback/0.pack.gz'

我已经在我的package.json文件中添加了以下内容:

"browser": {
    "fs": false,
    "os": false,
    "path": false
  }

我找不到webpack.js.js,互联网告诉我添加:

module.exports = function (webpackEnv) {
  // ...
  return {
   // ...
    resolve: {
      // ...
      fallback: {
        // 👇️👇️👇️ add this 👇️👇️👇️
        "fs": false,
        "os": false,
        "path": false,
      }
    }
  }
}
jqjz2hbq

jqjz2hbq1#

您遇到的错误消息,“模块未找到:Can 't resolve 'fs',”通常发生在Next.js应用程序中,当您尝试在客户端使用'fs'(文件系统)模块时,这是一个Node.js内置模块。但是,Next.js不允许您在客户端使用某些Node.js内置模块,因为它们在浏览器中不可用。
以下是您可能遇到此错误的几种常见情况以及如何解决它们:
1.在组件中使用'fs':如果你试图在一个应该在客户端运行的组件中使用'fs',你应该重构你的代码以避免使用它。'fs'用于服务器端操作。
1.服务端代码:如果您试图在服务器端代码中使用'fs'(例如,在API路由中),请确保它位于Next.js项目的服务器目录中。'fs'模块可以在服务器端使用。
1.动态导入:如果您使用动态导入,请确保仅在服务器端导入'fs'。您可以通过使用条件检查或将导入放置在仅服务器代码块中来完成此操作。举例来说:

if (typeof window === 'undefined') {
  const fs = require('fs');
  // Use fs here on the server side
}

1.检查依赖关系:有时,第三方软件包可能会导致此问题。检查您正在使用的任何包或其依赖项是否试图在客户端使用'fs'。如果您发现了这样的包,您可能需要找到一个替代方案或自定义其用法。
1.下一步.js配置:如果您修改了Next.js配置(例如webpack配置)并引入了问题,请确保您没有无意中尝试在配置中的客户端代码中使用'fs'。
1.文件传输路径:如果您使用的是基于Next.js文件系统的路由,请确保使用“fs”的API路由位于“pages/API”目录中,该目录用于服务器端代码。
总之,错误消息“Module not found:在Next.js应用程序中出现Can 't resolve 'fs'“表示您正在尝试以客户端不支持的方式使用'fs'模块。检查您的代码和项目结构,以确保“fs”仅在服务器端使用,并考虑使用服务器端路由进行文件系统操作。

相关问题