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

[silverbackdan]

Bug report

• I confirm this is a bug with Supabase, not with my own application.
• I confirm I have searched the Docs, GitHub Discussions, and Discord.

Describe the bug

When building for Nuxt, once deployed applications will fail to run. It appears this gets into the server build.

https://github.com/supabase/realtime-js/blob/master/src/WebSocket.ts#L8

In server.mjs output this looks like this

const {
  PostgrestClient,
  PostgrestQueryBuilder,
  PostgrestFilterBuilder,
  PostgrestTransformBuilder,
  PostgrestBuilder,
  PostgrestError
} = index$2;
let WebSocketImpl;
{
  WebSocketImpl = require("ws");
}
const version$3 = "2.11.9";
const DEFAULT_HEADERS$3 = { "X-Client-Info": `realtime-js/${version$3}` };
const VSN = "1.0.0";
...

A clear and concise description of what the bug is.

To Reproduce

Install this dep which will be a part of the install for @nuxtjs/supabase - in the Nuxt application run pnpm build and then run the output node .output/server/index.mjs

Expected behavior

The application should not crash because we should be using mjs spec which is import/export instead of require.

Screenshots

System information

Using latest version of pnpm, node etc.

Additional context

Please correct me if I'm wrong but I can't see a workaround right now unless this package becomes compatible with ESM? I'm not sure I'm able to configure an optimization but I'll try.

[silverbackdan]

My temporary fix is adding overrides to my package.json

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

[j4w8n]

Thank you for the feedback. I've been told the team is looking into a fix, but recommend reverting to a previous version. Or, if you choose to, do an override.

[grdsdev]

Hi, we're working on a fix for this issue in Supabase. It would be great if you 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, thank you :)

[silverbackdan]

Would be interested to know the source of the issue to help me learn in future if I'm able to give more info into a fix

[lokinderchauhan]

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

Thanks.
This is resulting next issue as Error: Could not resolve "bufferutil" imported by "ws". Is it installed?

[grdsdev]

Hi @lokinderchauhan please provide more information on your issue, where is that error happening? Is it also a nuxt project?

[lokinderchauhan]

Hi @lokinderchauhan please provide more information on your issue, where is that error happening? Is it also a nuxt project?

Hi @grdsdev, issue is coming in my react router project. project builds successfully, but throw error when I run it with command
react-router-serve ./build/server/index.js
here are details about error
Error: Could not resolve "bufferutil" imported by "ws". Is it installed? at file://-------/apps/web/build/server/assets/server-build-B3LEXcem.js:50590:7 at ModuleJob.run (node:internal/modules/esm/module_job:271:25) at onImport.tracePromise.__proto__ (node:internal/modules/esm/loader:547:26)

Code in build file server-build-B3LEXcem.js:50590:7 on line 50590 is as
throw new Error('Could not resolve "bufferutil" imported by "ws". Is it installed?');

[filipecabaco]

@lokinderchauhan can you check with the latest version of supabase-js?

[lokinderchauhan]

@lokinderchauhan can you check with the latest version of supabase-js?

Hi @filipecabaco I checked with @supabase/supabase-js 2.49.10 and issue is still there. Same error log as I posted in last comment is coming. I reverted @supabase/supabase-js to version 2.49.8 and its working fine.

[filipecabaco]

hey, we're looking into it but seems to be related with another dynamic import of Supabase/fetch