Layer doesnt import module

I have the Supabase module installed in a layer, along with several components, each with its own functionality. When I use this layer via extend in the main application, the components from the Supabase layer appear, but their functionality doesn’t work.

The error message is clear: the useSupabaseClient composable from the Supabase layer isn’t available, even though this composable is provided by the module.

What could be causing this issue? (Note: the base application doesn’t have the Supabase module itself—I thought that if the layer were imported correctly, it should include the module as well.)

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  extends: ['../nuxtLayers/authentication2'],
  modules: [
    '@nuxtjs/tailwindcss',
    '@pinia/nuxt',
    'radix-vue/nuxt',
    '@vueuse/nuxt'
  ],
  runtimeConfig: {
    public: {
      PADDLE_ENVIRONMENT: process.env.PADDLE_ENVIRONMENT,
      PADDLE_FRONT_TOKEN: process.env.PADDLE_FRONT_TOKEN,
    },
  },
  supabase: {
    url: process.env.SUPABASE_URL,
    key: process.env.SUPABASE_KEY,
    serviceKey: process.env.SUPABASE_SERVICE_KEY,
    clientOptions: {
      auth: {
        flowType: 'pkce',
        autoRefreshToken: true,
              detectSessionInUrl: true,
              persistSession: false,
      },
    },
    redirectOptions: {
      login: '/login',
      callback: '/confirm',
      include: undefined,
      exclude: ['/','/signout','/settings','/help'],
      cookieRedirect: false,}}})

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  extends: ['../nuxtLayers/authentication2'],
  modules: [
    '@nuxtjs/tailwindcss',
    '@pinia/nuxt',
    'radix-vue/nuxt',
    '@vueuse/nuxt'
  ],
  runtimeConfig: {
    public: {
      PADDLE_ENVIRONMENT: process.env.PADDLE_ENVIRONMENT,
      PADDLE_FRONT_TOKEN: process.env.PADDLE_FRONT_TOKEN,
    },
  },
  supabase: {
    url: process.env.SUPABASE_URL,
    key: process.env.SUPABASE_KEY,
    serviceKey: process.env.SUPABASE_SERVICE_KEY,
    clientOptions: {
      auth: {
        flowType: 'pkce',
        autoRefreshToken: true,
              detectSessionInUrl: true,
              persistSession: false,
      },
    },
    redirectOptions: {
      login: '/login',
      callback: '/confirm',
      include: undefined,
      exclude: ['/','/signout','/settings','/help'],
      cookieRedirect: false,}}})

Uncaught (in promise) ReferenceError: useSupabaseClient is not defined
    at setup (authenticationSigninLogin.vue:2:18)
      ...
    at processFragment (runtime-core.esm-bundler.js?v=6c5563d9:5099:7)
    at patch (runtime-core.esm-bundler.js?v=6c5563d9:4659:9)

Uncaught (in promise) ReferenceError: useSupabaseClient is not defined
    at setup (authenticationSigninLogin.vue:2:18)
      ...
    at processFragment (runtime-core.esm-bundler.js?v=6c5563d9:5099:7)
    at patch (runtime-core.esm-bundler.js?v=6c5563d9:4659:9)

Nuxt•16mo ago•

4 replies

IsaacR943

Layer doesnt import module

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  extends: ['../nuxtLayers/authentication2'],
  modules: [
    '@nuxtjs/tailwindcss',
    '@pinia/nuxt',
    'radix-vue/nuxt',
    '@vueuse/nuxt'
  ],
  runtimeConfig: {
    public: {
      PADDLE_ENVIRONMENT: process.env.PADDLE_ENVIRONMENT,
      PADDLE_FRONT_TOKEN: process.env.PADDLE_FRONT_TOKEN,
    },
  },
  supabase: {
    url: process.env.SUPABASE_URL,
    key: process.env.SUPABASE_KEY,
    serviceKey: process.env.SUPABASE_SERVICE_KEY,
    clientOptions: {
      auth: {
        flowType: 'pkce',
        autoRefreshToken: true,
              detectSessionInUrl: true,
              persistSession: false,
      },
    },
    redirectOptions: {
      login: '/login',
      callback: '/confirm',
      include: undefined,
      exclude: ['/','/signout','/settings','/help'],
      cookieRedirect: false,}}})

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  extends: ['../nuxtLayers/authentication2'],
  modules: [
    '@nuxtjs/tailwindcss',
    '@pinia/nuxt',
    'radix-vue/nuxt',
    '@vueuse/nuxt'
  ],
  runtimeConfig: {
    public: {
      PADDLE_ENVIRONMENT: process.env.PADDLE_ENVIRONMENT,
      PADDLE_FRONT_TOKEN: process.env.PADDLE_FRONT_TOKEN,
    },
  },
  supabase: {
    url: process.env.SUPABASE_URL,
    key: process.env.SUPABASE_KEY,
    serviceKey: process.env.SUPABASE_SERVICE_KEY,
    clientOptions: {
      auth: {
        flowType: 'pkce',
        autoRefreshToken: true,
              detectSessionInUrl: true,
              persistSession: false,
      },
    },
    redirectOptions: {
      login: '/login',
      callback: '/confirm',
      include: undefined,
      exclude: ['/','/signout','/settings','/help'],
      cookieRedirect: false,}}})

Uncaught (in promise) ReferenceError: useSupabaseClient is not defined
    at setup (authenticationSigninLogin.vue:2:18)
      ...
    at processFragment (runtime-core.esm-bundler.js?v=6c5563d9:5099:7)
    at patch (runtime-core.esm-bundler.js?v=6c5563d9:4659:9)

Uncaught (in promise) ReferenceError: useSupabaseClient is not defined
    at setup (authenticationSigninLogin.vue:2:18)
      ...
    at processFragment (runtime-core.esm-bundler.js?v=6c5563d9:5099:7)
    at patch (runtime-core.esm-bundler.js?v=6c5563d9:4659:9)

Layer doesnt import module

Layer doesnt import module

Similar Threads

Similar Threads

Similar Threads