Uncaught SyntaxError ambiguous indirect export createClient

I'm trying to just get information from the database via API from the client side.

I have two files.
index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Workshops</title>
        <script type="module" src="./main.js"></script>

    </head>
    <body>

    </body>
</html>


and main.js
import { createClient } from "https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2";

const SUPABASE_URL = "";
const SUPABASE_KEY = "";

// Create a single supabase client for interacting with your database
const  supabase = createClient(SUPABASE_URL, SUPABASE_KEY);

// Code here waits to run until the DOM is loaded.
const getWorkshops = async () => {
    try {
        let { data: workshops } = await supabase
        .from('workshops')
        .select('*');
    
        return workshops
    } catch (error) {
        console.log(`500 Internal Server Error. err: ${error}`);
    }
}

console.log(getWorkshops);


All files in the root directory.
Getting the following error in the console;
Uncaught SyntaxError: ambiguous indirect export: createClient

Can anybody please help me? 🙏
Was this page helpful?