Attempting to bring the MongoClient into my Vue project without triggering an error.
const MongoClient = require("mongodb").MongoClient;
Error message in the browser:
> 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)
Upon inspecting the code at /node_modules/mongodb/lib/utils.js, a single split() operation was found:
...const nodejsMajorVersion = +process.version.split('.')[0].substring(1);
Realized that process.version (and even process) are undefined. So, I set:
const nodejsMajorVersion = 14;
This resolved the issue, but led to another one:
> 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)
node --version --> v14.17.1
npm mongodb --version --> 6.14.13
Tried reinstalling both node and mongodb already. Yet, the issues persist.
Package.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"
}
}
Any suggestions on how to resolve these issues?