Next.js 15 ReferenceError: Cannot access 'isBrowser' before initialization

[vladimir-nesterov]

In the clean project Next 15 made a form:

import { createClient } from "@deepgram/sdk";
export default function FormLoadAudio() {

async function handleUpload(dataForm: FormData) {
'use server';
const deepgram = createClient(process.env.DEEPGRAM_API_KEY ?? "");
}

return (

Load Audio

Submit

);
}

When calling a function createClient the browser displays an error:
Server Error
ReferenceError: Cannot access 'isBrowser' before initialization

How can I fix this error?
(There is a DEEPGRAM_API_KEY key in .env.local)

[deepgram-community[bot]]

Hey there! It looks like you haven't connected your GitHub account to your Deepgram account. You can do this at https://community.deepgram.com - being verified through this process will allow our team to help you in a much more streamlined fashion.

[deepgram-community[bot]]

It looks like we're missing some important information to help debug your issue. Would you mind providing us with the following details in a reply?

• The deepgram product you are using (e.g Speech to Text, Agent API)
• A request ID that triggered your error or issue.

[vladimir-nesterov]

package.json

{
"name": "deepgram-js-sdk-nextjs",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev --turbopack",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@deepgram/sdk": "^3.9.0",
"next": "15.0.3",
"react": "19.0.0-rc-66855b96-20241106",
"react-dom": "19.0.0-rc-66855b96-20241106"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "15.0.3",
"typescript": "^5"
}
}

[deepgram-community[bot]]

It seems like you're encountering a scope issue with the 'isBrowser' variable in your Next.js project. This error typically occurs when a variable is used before it's defined or initialized.

However, without seeing the full context of your code, it's hard to provide a precise solution. The 'isBrowser' variable might be used in the '!subteam^S01J8LPFU8N|@deepgram/sdk' package or in your own code.

If 'isBrowser' is a variable in your own code, make sure it's defined before you call the createClient function. If it's in the '!subteam^S01J8LPFU8N|@deepgram/sdk' package, it might be a bug or compatibility issue with Next.js.

In the latter case, you could try the following steps:

1. Ensure you're using the latest version of '!subteam^S01J8LPFU8N|@deepgram/sdk'. Update the package if necessary.
2. Check the official '!subteam^S01J8LPFU8N|@deepgram/sdk' documentation or GitHub issues for any reported bugs or compatibility issues with Next.js.
3. If the issue persists, consider opening a new issue in the '!subteam^S01J8LPFU8N|@deepgram/sdk' GitHub repository with a detailed description of your problem and the error message you're receiving.

Remember to include the version of Next.js and '!subteam^S01J8LPFU8N|@deepgram/sdk' you're using, as well as relevant snippets of your code. This will help the maintainers understand and address your issue more effectively.

John Vajda

[VGraupera]

I am having the same issue, doesnt seem to work out of the box with turbopack. is there a way to configure it, or is there any update? Here is the GH issue, deepgram/deepgram-js-sdk#346 thanks