Vue + Supabase
A supa simple wrapper around Supabase.js to enable usage within Vue.
Installation
# Vue 3.x
yarn add vue-supabase
# Vue 2.x
yarn add @vue/composition-api vue-supabaseNote: Currently @vue/composition-api is required for this package to work for projects using Vue 2.x.
Usage
Vue 2.x
import VueSupabase from "vue-supabase";
Vue.use(VueSupabase, {
supabaseUrl: "",
supabaseKey: "",
supabaseOptions: {},
});const { data, error } = await this.$supabase.from("events").select("*");Vue 3.x
import VueSupabase from 'vue-supabase'
const app = createApp(...)
app.use(VueSupabase, {
supabaseUrl: '',
supabaseKey: '',
supabaseOptions: {}
})
app.mount(...)Options API
const { data, error } = await this.$supabase.from("events").select("*");Composition API
import { useSupabase } from "vue-supabase";
const supabase = useSupabase();
const { data, error } = await supabase.from("events").select("*");Here are a couple of composables available with Vue 3.x or Vue 2.x + Composition API
import { useSuabaseAuth, useSupabaseStorage } from "vue-supabase";
const auth = useSupabaseAuth();
const storage = useSupabaseStorage();
const { data } = await storage.listBuckets();
await auth.signOut();