supabase
supabase copied to clipboard
Upgrade @nuxtjs/supabase from 0.3.x to 1.0.x: 500 error on initial page load
My page is showing elements based on "user" (like 'Sign in' button). Before upgrade to v1 it was working just fine. After upgrading I get 500 error on initial page load or page refresh. If I navigate the page from menu, it works fine again. If I turn SSR to FALSE in Nuxt config it works fine. It seems that useSupabaseUser() is not available during render? I am working on localhost.
<template>
<header>
<UButton title="Sign in" to="/signin" v-if="!user && route.name != 'signin'" />
</header>
</template>
<script setup>
const route = useRoute();
const user = useSupabaseUser();
</script>
My package.json
{
"name": "nuxt-app",
"private": true,
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev",
"generate": "nuxt generate",
"preview": "nuxt preview",
"postinstall": "nuxt prepare"
},
"devDependencies": {
"@nuxt/devtools": "latest",
"@nuxthq/ui": "^2.7.0",
"@nuxtjs/html-validator": "^1.5.2",
"@nuxtjs/i18n": "^8.0.0-rc.3",
"@nuxtjs/supabase": "^1.0.2",
"nuxt": "^3.7.0"
},
"dependencies": {
"@vuelidate/core": "^2.0.3",
"@vuelidate/validators": "^2.0.4",
"vue": "^3.3.4"
}
}
Error message:
[nuxt] A composable that requires access to the Nuxt instance was called outside of a plugin, Nuxt hook, Nuxt middleware, or Vue setup function. This is probably not a Nuxt bug. Find out more at https://nuxt.com/docs/guide/concepts/auto-imports#using-vue-and-nuxt-composables