React项目启动报错：无法解析node_modules/mongodb/lib中的'dns'

dns是Node.js的核心内置模块，浏览器环境（React运行的前端环境）并不支持该模块。你遇到的错误本质是：mongodb包是给后端Node.js环境使用的数据库驱动，直接在前端React项目里引入它，就会触发浏览器不支持Node核心模块的报错。

方案1：后端代理（推荐，安全规范） #

• 搭建一个Node.js后端服务，在后端代码中使用mongodb包连接数据库
• 前端React通过fetch/axios调用后端接口来完成数据操作，完全避免在前端直接引入数据库驱动

方案2：前端兼容处理（仅本地测试用，不推荐上线） #

这种做法会把数据库连接信息暴露在前端，存在严重安全风险，仅适合本地调试：

• 安装浏览器兼容包：

  npm install browserify-fs dns.js --save
  

• 若项目无webpack.config.js，则在根目录创建该文件并添加配置：

  module.exports = {
    resolve: {
      fallback: {
        "dns": require.resolve("dns.js"),
        "fs": require.resolve("browserify-fs")
      }
    }
  };
  

方案3：移除错误引入的依赖 #

检查React项目中是否误引入了mongodb包，比如复制了后端代码到前端，直接卸载即可：

npm uninstall mongodb

内容的提问来源于stack exchange，提问作者ProbablyNotKai