Search code examples
typescriptnuxt.jsmilvusgrpc-js

Milvus 2 Node.js SDK error: "TypeError: Class extends value undefined is not a constructor or null"

I'm working on my Nuxt.js app. For the database, I have chosen Milvus. I want to do a similarity search, but I encountered an error in the browser console.

I have the following code:

app.vue

// Other code

<script setup lang="ts">
import { MilvusClient } from "@zilliz/milvus2-sdk-node";

// I also have other code not related to Milvus here, but I don't think it's relevant

(async () => {
  const milvusClient = new MilvusClient({
    address: "localhost:19530",
    username: "",
    password: "",
  });

  // Similarity search
  const test = await milvusClient.search({
    collection_name: "xxxxx", // My collection name here
    vector: [ // My vector here ],
  });

  // Sort the results by score in descending order
  const sortedResults = test.results.sort((a, b) => b.score - a.score);

  // Display the descriptions with scores
  sortedResults.forEach((result) => {
    console.log(`[${result.score}]: ${result.description}`);
  });
})();
</script>

package.json

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "autoprefixer": "^10.4.16",
    "nuxt": "^3.9.3",
    "postcss": "^8.4.33",
    "tailwindcss": "^3.4.1",
    "vue": "^3.4.6",
    "vue-router": "^4.2.5"
  },
  "dependencies": {
    "@nuxt/ui": "^2.10.0",
    "@zilliz/milvus2-sdk-node": "^2.3.5",
    "nuxt-security": "^1.1.0"
  }
}

As you can see in app.vue above, I'm using the Milvus 2 Node.js SDK, but I'm getting the following error in the browser console:

TypeError: Class extends value undefined is not a constructor or null
    at node_modules/@grpc/grpc-js/build/src/call.js (@zilliz_milvus2-sdk-node.js?v=bfe1cc22:10658:54)
    at __require (chunk-PIXRU2QS.js?v=bfe1cc22:10:50)
    at node_modules/@grpc/grpc-js/build/src/client.js (@zilliz_milvus2-sdk-node.js?v=bfe1cc22:11182:18)
    at __require (chunk-PIXRU2QS.js?v=bfe1cc22:10:50)
    at node_modules/@grpc/grpc-js/build/src/make-client.js (@zilliz_milvus2-sdk-node.js?v=bfe1cc22:11562:20)
    at __require (chunk-PIXRU2QS.js?v=bfe1cc22:10:50)
    at node_modules/@grpc/grpc-js/build/src/channelz.js (@zilliz_milvus2-sdk-node.js?v=bfe1cc22:11663:25)
    at __require (chunk-PIXRU2QS.js?v=bfe1cc22:10:50)
    at node_modules/@grpc/grpc-js/build/src/subchannel.js (@zilliz_milvus2-sdk-node.js?v=bfe1cc22:12227:22)
    at __require (chunk-PIXRU2QS.js?v=bfe1cc22:10:50)

I've searched this error in general and found multiple answers on StackOverflow saying that this is probably caused by circular dependency. I used dpdm to find potential circular dependency.

I ran the following command:

dpdm app.vue

But no circular dependency was found:

✔ [0/0] Analyze done!
• Dependencies Tree
  - 0) app.vue

• Circular Dependencies
  ✅ Congratulations, no circular dependency was found in your project.

• Warnings

I've been trying for quite some time, following official examples, but I'm not able to solve this error.

Solution

  • The library @grpc/grpc-js doesn't work on the browser, it only works on Node.js. It looks like you are getting it as a transitive dependency of the Milvus 2 Node.js SDK, which also states in its README that it requires Node.js.