I followed this Expo tutorial from the supabase docs. I intend to use it to build a react native app and compile for android, iOS and web. The app version works perfectly on Expo Go, but when I tried to run the web version it gave the following error in the console: Uncaught TypeError: Cannot destructure property 'PostgrestClient' of '_index.default' as it is undefined.
I strictly followed the tutorial when creating the app. The only changes I made was installing the dependencies for react native for web and updating the typescript version.

I commented out sections of the code to work out what part was causing the issue as the error message and call stack were very cryptic. I narrowed it down to the following useEffect statement in the App.tsx file.

useEffect(() => {
    supabase.auth.getSession().then(({ data: { session } }) => {
      setSession(session);
    });
    supabase.auth.onAuthStateChange((_event, session) => {
      setSession(session);
    });
  }, []);

Based on this I believe that the issue is related to the supabase helper file:

import AsyncStorage from "@react-native-async-storage/async-storage";
import { createClient } from "@supabase/supabase-js";

const supabaseUrl = "https://kvkpowuxvtipspupehkr.supabase.co";
const supabaseAnonKey =
  "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imt2a3Bvd3V4dnRpcHNwdXBlaGtyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MTk4ODgwMzgsImV4cCI6MjAzNTQ2NDAzOH0.XuYw44clXDQvRC2vMONL-QVxYbRhfxyjLj_tIo5boB4";

export const supabase = createClient(supabaseUrl, supabaseAnonKey, {
  auth: {
    storage: AsyncStorage,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});

The part that seems to be incompatible is the “createClient” function. I tried to use code from this tutorial in one of my other projects and I found that by just having import { createClient } from "@supabase/supabase-js"; in the supabase file was enough to make it throw the error.

I have done what I can to try to research and remedy the problem but I still do not understand why this happens. The createClient function is also referenced in the React tutorial in the supabase docs, implying that it should work fine on web. I am very lost as to why this occurs, any help is appreciated, thanks.