无法导入 MongoClient

Question

尝试将 MongoClient 导入我的 Vue 项目并期望它不会抛出错误。

const MongoClient = require("mongodb").MongoClient;

浏览器出错：

> utils.js?071e:543 Uncaught TypeError: Cannot read property 'split' of undefined
at Object.eval (utils.js?071e:543)
at eval (utils.js:913)
at Object..**/node_modules/mongodb/lib/utils.js** (chunk-vendors.js:5077)
at __webpack_require__ (app.js:854)
at fn (app.js:151)
at eval (read_preference.js?4638:2)
at Object..**/node_modules/mongodb/lib/core/topologies/read_preference.js** (chunk-vendors.js:3997)
at __webpack_require__ (app.js:854)
at fn (app.js:151)
at eval (shared.js?2650:3)

Error in the browser console

我检查了这里的代码：/node_modules/mongodb/lib/utils.js，发现只有一个 split() 操作：

...const nodejsMajorVersion = +process.version.split('.')[0].substring(1);

认为 process.version（甚至是 process）是未定义的。设置：

const nodejsMajorVersion = 14;

解决了这个问题，但后来我得到了这个：

> defaultable.js?6987:55 Uncaught Error: Cannot find module 'net'
at webpackEmptyContext (eval at ./node_modules/defaultable sync recursive (app.js:1088), <anonymous>:2:10)
at Object.workaround_require (defaultable.js?6987:49)
at require (defaultable.js?6987:77)
at eval (server.js?663d:9)
at defaulter (defaultable.js?6987:83)
at defaultable (defaultable.js?6987:63)
at good (defaultable.js?6987:174)
at Object.eval (server.js?663d:5)
at eval (server.js:242)
at Object../node_modules/hbo-dnsd/server.js (chunk-vendors.js:3106)

Error in the browser console

node --version          --> v14.17.1
npm mongodb --version   --> 6.14.13

已经尝试重新安装node和mongodb。还是一样的问题。

包.json：

{
  "name": "snlh_no_ts",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "dns": "^0.2.2",
    "mongodb": "^3.6.9",
    "mongodb-client-encryption": "^1.2.5",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-unit-jest": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/eslint-config-prettier": "^6.0.0",
    "@vue/test-utils": "^1.0.3",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-prettier": "^3.3.1",
    "eslint-plugin-vue": "^6.2.2",
    "prettier": "^2.2.1",
    "sass": "^1.26.5",
    "sass-loader": "^8.0.2",
    "vue-template-compiler": "^2.6.11"
  }
}

有什么办法解决这个问题吗？

Answer 1

好的，看来您尝试在客户端（前端）导入mongodb，它在浏览器中而不是在node.js 环境中运行，这是mongodb 工作所必需的。

为了解决您的问题，您应该运行一个 node.js 服务器，它将连接您的数据库并通过 api 与您的前端一起工作。