TypeError: Cannot read properties of undefined (reading 'prototype') objectid.js

[barclayiversen]

Prerequisites

• I have written a descriptive issue title
• I have searched existing issues to ensure the bug has not already been reported

Mongoose version

7.0.3

Node.js version

18.15.0

MongoDB server version

5, also happens on 4.4.9

Typescript version (if applicable)

No response

Description

An error is bubbling up from the mongoose/lib/types/objectid.js file on what is more or less boilerplate code for a nextjs project.

error - node_modules\mongoose\lib\types\objectid.js (21:31) @ prototype error - TypeError: Cannot read properties of undefined (reading 'prototype') at eval (webpack-internal:///(sc_server)/./node_modules/mongoose/lib/types/objectid.js:15:36) at (sc_server)/./node_modules/mongoose/lib/types/objectid.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:2739:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./node_modules/mongoose/lib/drivers/node-mongodb-native/collection.js:7:18) at (sc_server)/./node_modules/mongoose/lib/drivers/node-mongodb-native/collection.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:462:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./node_modules/mongoose/lib/drivers/node-mongodb-native/index.js:4:22) at (sc_server)/./node_modules/mongoose/lib/drivers/node-mongodb-native/index.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:484:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./node_modules/mongoose/lib/index.js:4:100) at (sc_server)/./node_modules/mongoose/lib/index.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:2068:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./node_modules/mongoose/index.js:5:18) at (sc_server)/./node_modules/mongoose/index.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:253:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./backend/config/dbConnect.js:5:66) at (sc_server)/./backend/config/dbConnect.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:165:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./app/api/products/route.js:7:83) at (sc_server)/./app/api/products/route.js (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:154:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at eval (webpack-internal:///(sc_server)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Fproducts%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Fproducts%2Froute.js&appDir=C%3A%5CUsers%5Cspracto%5Csrc%5CnestPracticeProject%5Cnext-practice-project-js%5Capp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=C%3A%5CUsers%5Cspracto%5Csrc%5CnestPracticeProject%5Cnext-practice-project-js&isDev=true&tsconfigPath=tsconfig.json&assetPrefix=!:13:148) at (sc_server)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Fproducts%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Fproducts%2Froute.js&appDir=C%3A%5CUsers%5Cspracto%5Csrc%5CnestPracticeProject%5Cnext-practice-project-js%5Capp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=C%3A%5CUsers%5Cspracto%5Csrc%5CnestPracticeProject%5Cnext-practice-project-js&isDev=true&tsconfigPath=tsconfig.json&assetPrefix=! (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:143:1) at __webpack_require__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\webpack-runtime.js:33:43) at __webpack_exec__ (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:3099:39) at C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:3100:28 at Object.<anonymous> (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\.next\server\app\api\products\route.js:3103:3) at Module._compile (node:internal/modules/cjs/loader:1254:14) at Module._extensions..js (node:internal/modules/cjs/loader:1308:10) at Module.load (node:internal/modules/cjs/loader:1117:32) at Module._load (node:internal/modules/cjs/loader:958:12) at Module.require (node:internal/modules/cjs/loader:1141:19) at require (node:internal/modules/cjs/helpers:110:18) at Object.requirePage (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\node_modules\next\dist\server\require.js:88:12) at C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\node_modules\next\dist\server\load-components.js:49:73 at async Object.loadComponentsImpl [as loadComponents] (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\node_modules\next\dist\server\load-components.js:49:26) at async DevServer.findPageComponentsImpl (C:\Users\spracto\src\nestPracticeProject\next-practice-project-js\node_modules\next\dist\server\next-server.js:600:36) { page: '/api/products' } null

Steps to Reproduce

https://github.com/barclayiversen/mongoose-issue-repro

Make a POST request to http://localhost:3000/api/products

Expected Behavior

A database entry should be made.

[reducio]

Try to write in next.config.js file:

experimental: {
  appDir: true,
  serverComponentsExternalPackages: ["mongoose"],
},

[barclayiversen]

That appears to have resolved the database connection issue. Thank you.

[vkarpov15]

Looks like this was introduced by https://github.com/mongodb/js-bson/pull/564/files: with topLevelAwait: true, Mongoose's require('bson') call now returns a promise 😕 . We're looking for a workaround, but realistically this bson change is quite problematic. I'd advise working around this by pinning the BSON version in your package.json:

  "dependencies": {
    "bson": "5.0.0",
    "mongoose": "^7.0.3",
    "next": "13.2.4",
    "next-connect": "^0.13.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "supports-color": "^9.3.1"
  },

[vkarpov15]

Turns out @reducio is 100% right, all you need to do is serverComponentsExternalPackages: ["mongoose"]. I guess Next.js does some messy stuff to try to coerce CommonJS into ESM. Either way, I can confirm the following change fixes the "Cannot read properties of undefined" error:

const path = require('path');

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    appDir: true,
    esmExternals: "loose",
    serverComponentsExternalPackages: ["mongoose"]
  },
  env: {
    DB_URI: "mongodb://127.0.0.1:27017/mongoose_test",
  },
  webpack: (config) => {
    config.experiments = {
      topLevelAwait: true,
      layers: true,
    };
    return config;
  },
};

module.exports = nextConfig;

[March-Wind]

How should one set up Webpack alone? Does anyone know