MongoDB can be connected with MongoClient but not mongoose

So when I run my app in deployment, with the backend connecting to MongoDB using MongoClient as follow:

import { MongoClient } from 'mongodb'

const url = process.env.MONGODB_URI 

MongoClient.connect(url, { useNewUrlParser: true, useUnifiedTopology: true },(err, db)=>{

everything works fine. But if I change it into

import mongoose from 'mongoose'

const url = process.env.MONGODB_URI 
mongoose.Promise = global.Promise
mongoose.connect(url, { useNewUrlParser: true, useCreateIndex: true, useUnifiedTopology: true })
mongoose.connection.on('error', () => {
  throw new Error(`unable to connect to database: ${url}`)

it gives the following error:

  throw new Error(`unable to connect to database: ${_config_config__WEBPACK_IMPORTED_MODULE_0__["default"].mongoUri}`)
Error: unable to connect to database: my_database_url,
    at NativeConnection.eval (webpack://HappyHourWeb/./server/server.js?:29:9)
    at NativeConnection.emit (node:events:390:28)
    at /Users/Hieudo/Documents/Project/HappyHourWeb/node_modules/mongoose/lib/connection.js:807:30
    at processTicksAndRejections (node:internal/process/task_queues:78:11)

My URI is in the form:


Any help is greatly appreciated!


did you find any resolution for above error?