Issue using in next.js 13

[razznblue]

Hello!

I am encountering an issue when importing this library into my next.js application.

This occurs when I load the page on which I am importing clarifai-nodejs-grpc

./node_modules/@grpc/grpc-js/build/src/channel-credentials.js:20:0
Module not found: Can't resolve 'tls'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@grpc/grpc-js/build/src/index.js
./node_modules/clarifai-nodejs-grpc/src/index.js
./pages/admin.js

I am using next.js v13.5.4 and clarifai-nodejs-grpc v9.9.6

Any advice on what I could try to get this working would be much appreciated. Thank you!

[trace2798]

@razznblue Did you get it solved? I am trying to use it with next.js 14 and got a module not found error.

[AGI-CEO]

I am having the same error when building with nextjs 14 app router

[trace2798]

Ya bro I never heard back from the team so I stopped caring

[Alfrick]

There is a tutorial on how to use Clarifai with Next.js here. You could look at it on how to correctly import the library.

[tot-ra]

I'm personally not that familiar with next.js, but it looks like you're trying to use tls on frontend? I think its a backend-only nodejs dependency, same as the library - Clarifai Node.js gRPC Client.

You could try to do some fallbacks with webpack, but I doubt it will work, especially part with managing and passing secrets.

I'd recommend moving using this code on backend only.

[nikita-clarifai]

@AGI-CEO Have you required grpc library as listed in Dynamic Approach section? https://github.com/Clarifai/clarifai-nodejs-grpc?tab=readme-ov-file#the-dynamic-approach

const { ClarifaiStub, grpc } = require("clarifai-nodejs-grpc");

Note: Do not require the grpc library directly via const grpc = require("@grpc/grpc-js");. This produces
authentication issues (via grpc.Metadata) whenever any other co-installed libraries have the @grpc/grpc-js
dependency (of a different version). Instead, require grpc as shown above.

Also, try to reinstall packages, maybe something was missing / not fetched:

rm -rf node_modules
yarn

If you notice any error during packages installation, please let us know.

[AGI-CEO]

There is a tutorial on how to use Clarifai with Next.js here. You could look at it on how to correctly import the library.

I have thoroughly reviewed the nodejs tutorial that is mostly a nextjs pages router (typescript) implementation of the clarifai nodejs api client. My issues remain.

[AGI-CEO]

@AGI-CEO Have you required grpc library as listed in Dynamic Approach section? https://github.com/Clarifai/clarifai-nodejs-grpc?tab=readme-ov-file#the-dynamic-approach
Also, try to reinstall packages, maybe something was missing / not fetched:

rm -rf node_modules
yarn

If you notice any error during packages installation, please let us know.

I tried your recommendation but still no joy.

After rm and reinstalling dependencies, I still get this error when testing API both via my frontend UI and thunderclient (postman-equivalent vs code extension)-

Module not found: Can't resolve 'clarifai-nodejs-grpc/node_modules/@grpc/grpc-js' in '/home/blaise-linux/code/copilot-gold-mvp/node_modules/clarifai-nodejs-grpc/src'

Import trace for requested module:
./node_modules/clarifai-nodejs-grpc/src/index.js
./src/app/api/age/route.jsx

./node_modules/clarifai-nodejs-grpc/src/index.js
Module not found: Can't resolve 'clarifai-nodejs-grpc/node_modules/@grpc/proto-loader' in '/home/blaise-linux/code/copilot-gold-mvp/node_modules/clarifai-nodejs-grpc/src'

Import trace for requested module:
./node_modules/clarifai-nodejs-grpc/src/index.js

I even tried running an npm install within the clarifai-nodejs-grpc node-module directory since after inspection there is no node-module within the directory which did create the missing requirements, but that resulted in different errors and I assessed I was already looking into the topic more than would be conducive to my ultimate goals.

Above demonstrates my use of dynamic approach.

I have not tried static approach and I am changing my tech stack to a Python FastAPI backend instead to make use of Clarifai's python SDK.

My preference is to build with nextjs since it is undoubtedly the best way to build an AI SaaS from a DX perspective (SSR, payments, subscription, authentication, marketing automation, vercel AI SDK, react UI), so I would still like to return to a non-python backend eventually.