realtime-js: Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

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

I’m receiving this warning (wasn’t receiving previous to reinstalling package.json):

./node_modules/node-gyp-build/index.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

Import trace for requested module:
./node_modules/node-gyp-build/index.js
./node_modules/bufferutil/index.js
./node_modules/websocket/lib/WebSocketFrame.js
./node_modules/websocket/lib/websocket.js
./node_modules/websocket/index.js
./node_modules/@supabase/realtime-js/dist/main/RealtimeClient.js
./node_modules/@supabase/realtime-js/dist/main/index.js
./node_modules/@supabase/supabase-js/dist/main/index.js
./app/api/supabase/createClient.ts
./app/api/supabase/index.ts
./app/api/index.ts
./app/decks/ai/create/[id]/page.tsx

When I uninstall "@supabase/supabase-js": "^2.33.1", from the app and remove the client code:

import { SupabaseClient, createClient } from "@supabase/supabase-js";


const supabaseUrl = process.env.SUPABASE_URL;
const supabaseKey = process.env.SUPABASE_ANON_KEY;

export const supabase = createClient<SupabaseClient<any, "public", any>>(
    `${supabaseUrl}`, 
    `${supabaseKey}`,
    {
        auth: {
            persistSession: false
        }
    }
);

The warning goes away.

To Reproduce

  1. Install the package in a nextjs app
  2. run next dev

Expected behavior

I expect there to be no warning as nothing seems to be wrong with the code in node-gyp (however I could be wrong) which is added by websocket:

if (typeof require.addon === 'function') { // if the platform supports native resolving prefer that
  module.exports = require.addon.bind(require)
} else { // else use the runtime version here
  module.exports = require('./node-gyp-build.js')
}

System information

  • MacOS Sonoma
  • next dev cli
  • Version of supabase-js: “@supabase/supabase-js”: “^2.33.1”,
  • Version of Node.js: happens in both 16 and 18

Additional context

Let me know if you have any insights or if you think this issue should be posted elsewhere. Thanks!

About this issue

  • Original URL
  • State: closed
  • Created 7 months ago
  • Reactions: 1
  • Comments: 15 (3 by maintainers)

Most upvoted comments

Alright, there is a quick workaround I found. Create file in your project /patches/node-gyp-build+4.7.0.patch with the following contents

diff --git a/node_modules/node-gyp-build/index.js b/node_modules/node-gyp-build/index.js
index de2d14d..b1e9794 100644
--- a/node_modules/node-gyp-build/index.js
+++ b/node_modules/node-gyp-build/index.js
@@ -1,5 +1,5 @@
 if (typeof require.addon === 'function') { // if the platform supports native resolving prefer that
-  module.exports = require.addon.bind(require)
+  module.exports = require('./node-gyp-build.js')
 } else { // else use the runtime version here
   module.exports = require('./node-gyp-build.js')
 }

Install https://www.npmjs.com/package/patch-package with npm i -D patch-package

Set up postinstall script:

 "scripts": {
  "postinstall": "patch-package"
 }

Run npm i to trigger.

thank you! 🙏 will still check today

Yes of course, I created a temporary repository. Link to the repository: https://github.com/taychris/nextjs-supabase.git

Required environment variables: NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY, NEXT_PUBLIC_ROOT_DOMAIN (should be set to localhost:3000) for the local environment.

Then you just run the npm i command and after that run npm run dev. In the browser, navigate to app.localhost:3000/categories. The error/warning can be seen in the terminal.

The issue went away for me after installing the latest version. I had to delete yarn.lock and run yarn before the warning went away. Also, the upcoming ws pr will ensure it never recurs. Closing the issue now as I opened it.

thank you! yeah yesterday that was the point I’ve reached. Also tried to overwrite some of the webpack configurations on nextjs but all the “patches” felt more like really bad hacks 😞 ( https://github.com/i18next/next-i18next/issues/1545#issuecomment-1006418772 )

I’ve also verified what @John4E656F mentioned, this is happening in multiple versions including latest.

I think that this PR might actually tackle this issue https://github.com/supabase/realtime-js/pull/263

Same here. the problem occurs in multiple nextjs + supabase project . With different supabase-js version from @supabase/supabase-js -> “^2.38.2” to @supabase/supabase-js -> “^2.38.4”,