NextJS Builder Integration error

Builder integration error: Looks like the Builder SDK has not been initialized properly (your API key has not been set). Make sure you are calling builder.init(“«YOUR-API-KEY»”); as early as possible in your application's code.

The integration has been done as is shown in the docs, so not sure what’s causing this

Hello @rafill,

Thank you for bringing this to our attention. In order to better assist you, could you kindly provide us with a screenshot of the error you encountered, as well as your directory structure for Next.js? We appreciate your cooperation.

Hello @rafill,

It looks like you’re using the app directory for integration, but the process is a bit different. To proceed, please refer to our documentation for the app router or consider creating a new Next.js project without the app directory and src folder.

Hi Manish,

Yes, I had followed the App router steps. I would rather not have to downgrade by NextJS to make this work

Hi @rafill,

I’m unable to reproduce this error, could you please tell us the node version you are using, package.json file screenshot and your builder API key?

node version: v20.4.0
Builder API key: 974f013379034f90b7881835137d7f94

Hello @rafill,

It appears that the problem is coming from the file components/builder.tsx. Could you please double-check that file?

Additionally, it would be greatly appreciated if you could share your code repository to assist us in reproducing the issue. Thank you very much!