Error thrown from SupabaseClient.ts:75 Uncaught Error: supabaseUrl is required, even though both variables are there.

[susmita-karibu]

Hi,

I followed the intsructions in this video (https://www.youtube.com/watch?v=Gz9bvYybaws&list=PL4cUxeGkcC9hUb6sHthUEwG7r9VDPBMKO&index=2)

1. added the following in .env

   REACT_APP_SUPABASE_URL=<url from my project>
   REACT_APP_ANON_KEY=<copied from my dashboard>

2. created supabaseClient.js as instructed.

   
   import { createClient } from '@supabase/supabase-js';
   const supabaseUrl = process.env.REACT_APP_SUPABASE_URL;
   const supabaseKey = process.env.REACT_APP_ANON_KEY;
   const supabase = createClient(supabaseUrl, supabaseKey); // got supabaseUrl is required error, in spite of this

export default supabase;

3. imported correctly in my Home.js file.

import supabase from "../config/supabaseClient"

const Home = () => { console.log(supabase); return (

Home

) }

export default Home

and still got the following error
<img width="896" alt="Screenshot 2024-09-04 at 11 47 23 AM" src="https://github.com/user-attachments/assets/d6f8c045-5844-4254-8fa5-62c9556fcbd5">

[susmita-karibu]

ok I set the env variables with export and it worked. But wondering why the .env didn't work.. any help will be appreciated.