Resurfaced bug: require is not defined in ES Module Scope

[silverbackdan]

Version

@nuxtjs/supabase: 1.5.1 nuxt: 3.17.4

Reproduction Link

Steps to reproduce

Install module, run build and run node .output/server/index.mjs

I saw this bug initially here: https://github.com/nuxt-modules/supabase/issues/14

What is Expected?

When a page loads, a 200 success

What is actually happening?

A 500 error and logged is:

ReferenceError: require is not defined in ES module scope, you can use import instead

Diagnosing

I've looked at the code in server.mjs that comes out and this appears

let WebSocketImpl;
{
  WebSocketImpl = require("ws");
}

I've found this in my node_modules as part of realtime-js here: https://github.com/supabase/realtime-js/blob/master/src/WebSocket.ts#L8

I've raised a bug but I'm not sure what the workaround for a Nuxt module might be...

I've tried adding

  vite: {
    optimizeDeps: {
      include: ['@supabase/realtime-js'],
    },
  }

Any ideas?

[silverbackdan]

I found a commit from 5 days ago introducing this bug in realtime-js - not sure if it should be rectified here or there.

[grdsdev]

Hi, I'm Guilherme from the Supabase team. I tried the demo app using the latest Supabase-js version but wasn't able to reproduce it.

@silverbackdan, do you have a reproducible Nuxt project so I can verify?

Thanks.

[silverbackdan]

Hi @grdsdev

I'll get one together. But just to be sure, you have to build for prod and run using the node command, then try to load the page to trigger the error? I'll probably start with the main demo app too from here https://supabase.nuxtjs.org/getting-started/demo and do this process :)

1. pnpm build
2. node .output/server/index.mjs

I realise I wasn;t clear on these crucial steps in my issue.

Another user using an Astro project is also having difficulties, he commented on the PR I found with the commit which introduced the issue 5 days ago.

https://github.com/supabase/realtime-js/pull/474

[silverbackdan]

My temporary fix is adding overrides to my package.json

  "pnpm": {
    "overrides": {
      "@supabase/realtime-js": "<2.11.9 || > 2.11.9"
    }
  }

[grdsdev]

@silverbackdan sorry if this is a dumb question, but I'm unfamiliar with the Nuxt ecosystem.

When running pnpm build I get the error:

ERROR  Missing NUXT_UI_PRO_LICENSE license key.                                                                                                                     1:36:58 PM
Purchase Nuxt UI Pro at https://ui.nuxt.com/pro/pricing to build your app in production.

Any way of building locally for production without the need for a license?

[silverbackdan]

Oh! That's annoying, absolutely there is. Allow me some time and instead I'll get a minimal project together that doesn't use the Nuxt UI Pro package.

[silverbackdan]

This is strange, I've taken the demo and you can change directory into the demo folder to run it, however, it runs. https://github.com/silverbackdan/supabase

@atej do you have a minimal repro for your framework?

[atej]

This is strange, I've taken the demo and you can change directory into the demo folder to run it, however, it runs. https://github.com/silverbackdan/supabase

@atej do you have a minimal repro for your framework?

Tried with a fresh Astro project, but couldn't reproduce the build error. Hard to track down what does lead to the compiled bundle having the erroneous block and what avoids it.

[silverbackdan]

Thanks both. As per @j4w8n who also commented on the fix linked to this issue, sounds like you are on it. I've avoided this version for now. It's strange, my website using it isn't actually a complicated site. If you need me to, I can add someone here to the project or make it public for a short time so you can grab the code and run it. It's a very simple, 1 page Nuxt application with few dependencies. Let me know if you'll need this. Thanks

[grdsdev]

Hi all, we're working on a fix for this issue in Supabase. It would be great if you guys could try out the version "@supabase/supabase-js": "2.49.9-next.3" and confirm if that fixed it for you.

Thanks.

[silverbackdan]

Fixed for me, appreciate your time and effort to get a resolution in place so promptly!

[atej]

Afraid the same issue persists for me in my Astro project with '2.49.9-next.3'. Build fails with require is not defined in ES module scope, you can use import instead

[AntonOfTheWoods]

@grdsdev I don't even know what nuxt is and I also have this issue - with 2.49.10. So pretty sure not fixed.

[yan-yanishevsky]

Having the same error when deploying to Cloudflare

[schfer]

Can confirm this w/ nuxt 3.17.4 and/or 3.17.5. Using the @supabase/supabase-js solely without the nuxt module does indeed work, but breaks my application which uses @nuxtjs/supabase.

Tried both workarounds mentioned here, neither overriding @supabase/realtime-js as mentioned by @silverbackdan, nor pinning @supabase/supabase-js to 2.49.9-next.3 as mentioned by @grdsdev does the trick.

When running in dev locally everything is fine and works as excepted. As @yan-yanishevsky, I also deploy to CF via NuxtHub. When previewing the build as mentioned in NuxtHub's debugging docs with npx nuxt build && npx nuxthub preview also everything works fine. Just when deploying via npx nuxthub deploy the deployed output immediantely fails to OP's description.

I also tried replicating the whole project setup with a clean nuxt install and adding deps one-by-one which sure pins it down to @nuxtjs/supabase. Also deploying another fresh instance including @nuxtjs/supabase via github actions reuslts in the same outcome.

Funny enough, the exact same codebase deployed from a M2 MacBook Air one week ago did perform friction-free to a solid working deployment. Since i have no access to the MBA anymore and switched back to good ol' Win11/WSL2, i can only compare the backup files which point to the exact same versions as used now.

[alexander-zuev]

Oh sh*t I thought I was going mad - I seem to have a very similar issue but not related to Nuxt.

Environment:

• Cloudflare workers

Running into this error when trying to deploy

✘ [ERROR] A request to the Cloudflare API (/accounts/9c02a0ea65440e5ee7d5b62990934324/workers/scripts/sensr/versions) failed.

  Uncaught ReferenceError: require is not defined
    at null.<anonymous>
  (file:///Users/az/projects/sensr/node_modules/.pnpm/@[email protected]/node_modules/@supabase/realtime-js/dist/module/WebSocket.js:6:5)
   [code: 10021]

  
  If you think this is a bug, please open an issue at:
  https://github.com/cloudflare/workers-sdk/issues/new/choose


 ELIFECYCLE  Command failed with exit code 1.

Full package.json for reference

{
  "name": "sensr",
  "description": "A template for building a React application with Vite, Hono, and Cloudflare Workers",
  "private": true,
  "type": "module",
  "version": "0.1.0",
  "engines": {
    "node": ">=22.0.0"
  },
  "packageManager": "[email protected]",
  "dependencies": {
    "@phosphor-icons/react": "^2.1.10",
    "@radix-ui/colors": "^3.0.0",
    "@radix-ui/react-accordion": "^1.2.11",
    "@radix-ui/react-alert-dialog": "^1.1.14",
    "@radix-ui/react-aspect-ratio": "^1.1.7",
    "@radix-ui/react-avatar": "^1.1.10",
    "@radix-ui/react-checkbox": "^1.3.2",
    "@radix-ui/react-collapsible": "^1.1.11",
    "@radix-ui/react-context-menu": "^2.2.15",
    "@radix-ui/react-dialog": "^1.1.14",
    "@radix-ui/react-dropdown-menu": "^2.1.15",
    "@radix-ui/react-hover-card": "^1.1.14",
    "@radix-ui/react-label": "^2.1.7",
    "@radix-ui/react-menubar": "^1.1.15",
    "@radix-ui/react-navigation-menu": "^1.2.13",
    "@radix-ui/react-popover": "^1.1.14",
    "@radix-ui/react-progress": "^1.1.7",
    "@radix-ui/react-radio-group": "^1.3.7",
    "@radix-ui/react-scroll-area": "^1.2.9",
    "@radix-ui/react-select": "^2.2.5",
    "@radix-ui/react-separator": "^1.1.7",
    "@radix-ui/react-slider": "^1.3.5",
    "@radix-ui/react-slot": "^1.2.3",
    "@radix-ui/react-switch": "^1.2.5",
    "@radix-ui/react-tabs": "^1.1.12",
    "@radix-ui/react-toggle": "^1.1.9",
    "@radix-ui/react-toggle-group": "^1.1.10",
    "@radix-ui/react-tooltip": "^1.2.7",
    "@supabase/supabase-js": "^2.49.10",
    "@tailwindcss/vite": "^4.1.8",
    "@tanstack/react-form": "^1.12.1",
    "@tanstack/react-query": "^5.80.3",
    "@tanstack/react-query-devtools": "^5.80.3",
    "@tanstack/react-router": "^1.120.15",
    "@tanstack/react-router-devtools": "^1.120.15",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "^1.1.1",
    "embla-carousel-react": "^8.6.0",
    "hono": "4.7.7",
    "input-otp": "^1.4.2",
    "lucide-react": "^0.513.0",
    "next-themes": "^0.4.6",
    "nitro-cloudflare-dev": "^0.2.2",
    "postgres": "^3.4.7",
    "react": "^19.1.0",
    "react-day-picker": "^9.7.0",
    "react-dom": "^19.1.0",
    "react-error-boundary": "^6.0.0",
    "react-hook-form": "^7.57.0",
    "react-markdown": "^10.1.0",
    "react-resizable-panels": "^3.0.2",
    "recharts": "^2.15.3",
    "remark-gfm": "^4.0.1",
    "sonner": "^2.0.5",
    "tailwind-merge": "^3.3.0",
    "tailwindcss": "^4.1.8",
    "typed.js": "^2.1.0",
    "unenv": "^1.10.0",
    "vaul": "^1.1.2",
    "zod": "^3.25.51",
    "zod-validation-error": "^3.4.1"
  },
  "devDependencies": {
    "@cloudflare/vite-plugin": "^1.5.0",
    "@cloudflare/workers-types": "^4.20250604.0",
    "@eslint/js": "9.25.1",
    "@storybook/addon-onboarding": "^9.0.4",
    "@storybook/addon-themes": "^9.0.4",
    "@storybook/builder-vite": "^9.0.5",
    "@storybook/react-vite": "^9.0.4",
    "@tanstack/router-plugin": "^1.120.15",
    "@types/node": "^22.15.29",
    "@types/pg": "^8.15.4",
    "@types/react": "^19.1.2",
    "@types/react-dom": "^19.1.2",
    "@vitejs/plugin-react": "^4.4.1",
    "babel-plugin-react-compiler": "19.1.0-rc.2",
    "eslint": "^9.25.0",
    "eslint-plugin-react-hooks": "^5.2.0",
    "eslint-plugin-react-refresh": "^0.4.19",
    "eslint-plugin-storybook": "^9.0.4",
    "globals": "^16.0.0",
    "prettier": "^3.5.3",
    "storybook": "^9.0.4",
    "tw-animate-css": "^1.3.4",
    "typescript": "~5.8.3",
    "typescript-eslint": "^8.30.1",
    "vite": "^6.3.5",
    "vite-tsconfig-paths": "^5.1.4",
    "wrangler": "^4.19.1"
  },
  "scripts": {
    "preinstall": "npx only-allow pnpm",
    "dev": "vite",
    "build": "vite build",
    "preview": "pnpm run build && vite preview",
    "deploy": "pnpm run build && pnpm run cf-typegen && wrangler deploy",
    "cf-typegen": "wrangler types",
    "lint": "eslint . --quiet --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
    "lint:fix": "eslint . --fix --quiet && prettier --write",
    "storybook": "storybook dev -p 6006",
    "build-storybook": "storybook build"
  }
}

[layerzzzio]

I have this Nuxt 3.17.5 I was trying to deploy to Cloudflare via Nuxt Hub v0.9.0 in which I use nuxt/supabase v1.5.1.

In the GitHub action, the building part (pnpm build) is OK.

However deploying to preview wasn't. The error I got was the following:

Error while publishing deployment: "Error: Failed to publish your Function. Got error: Uncaught ReferenceError: require is not defined\n at chunks/nitro/nitro.mjs:1:313574\n" - [POST]

Looking at the nitro.mjs file, the only require keyword is the one related to ws as explained here https://github.com/nuxt-modules/supabase/issues/502#issue-3110256887;

The fix for me was to override the version of @supabase/supabase-js coming from @nuxt/supabase to v2.48.0 by adding a pnpm override in package.json as such:

{
  "pnpm": {
    "overrides": {
      "@supabase/supabase-js": "2.48.0"
    }
  }
}

Then I merged my feature branch to main and the NuxtHub deployment was also successful with the above override.

Note: I tried "@supabase/supabase-js": "2.48.1" // "@supabase/supabase-js": "^2.49.1" // "^2.50.0" and it failed each time with the same error.

[schfer]

I have this Nuxt 3.17.5 I was trying to deploy to Cloudflare via Nuxt Hub v0.9.0 in which I use nuxt/supabase v1.5.1.

In the GitHub action, the building part (pnpm build) is OK.

However deploying to preview wasn't. The error I got was the following:

Error while publishing deployment: "Error: Failed to publish your Function. Got error: Uncaught ReferenceError: require is not defined\n at chunks/nitro/nitro.mjs:1:313574\n" - [POST]

Looking at the nitro.mjs file, the only require keyword is the one related to ws as explained here #502 (comment);

The fix for me was to override the version of @supabase/supabase-js coming from @nuxt/supabase to v2.48.0 by adding a pnpm override in package.json as such:

{ "pnpm": { "overrides": { "@supabase/supabase-js": "2.48.0" } } } Then I merged my feature branch to main and the NuxtHub deployment was also successful with the above override.

Note: I tried "@supabase/supabase-js": "2.48.1" // "@supabase/supabase-js": "^2.49.1" // "^2.50.0" and it failed each time with the same error.

Can confirm! Just override @supabase/supabase-js to pin to v. 2.48.0, removed .nuxt, node_modules, package-lock.json and reinstalled everything, pushed to NuxtHub and runs.

[Ethanjfobrien]

having the same problem deploying cloudflare agent starter. Thanks for the temporary fix.

it seems this came up in the past, so maybe there should be regression test added for this? or at least a good warning comment https://github.com/supabase/realtime-js/issues/266

[grdsdev]

Hey all, can you give v2.50.1-next.5 a try?

Thanks.

[felixgabler]

Hey all, can you give v2.50.1-next.5 a try?

Thanks.

Yes, works for me again! Thanks 👍

[AntonOfTheWoods]

Seems to work here too.

[GeekyMonkey]

My Nuxt Cloudflare build is now working when I include v2.50.1-next5.

[nicokempe]

The changes just got merged into the master in https://github.com/supabase/realtime-js/commit/852a02db0f310354f295d319ca67cca5288c2972 and https://github.com/supabase/realtime-js/commit/ae9d6e0f9dd00d147646e3c10918f92508d48c7c. And they already bumped the dependency in supabase-js in https://github.com/supabase/supabase-js/commit/008063e4ee768ef5df151227ddf1de405cde4710. The official Supabase JS v2.50.1 is out for 2 hours now, that should fix it so the version should be able to be bumped to resolve this issue entirely, right?

[grdsdev]

The fix just got released as v2.50.1.

Please, update and let me know if you're still facing this issue.

Thanks.

[larbish]

Just updated supabase-js version in https://github.com/nuxt-modules/supabase/commit/162e559f4c59f23cd8805829b400b765f7167641

Can you have a try with v1.5.3 and confirm it's fixed 🙏 ?

[loicduong]

@larbish I upgraded to version v1.5.3 and the issue has been resolved.

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 30 days.