this.$auth0.loginWithRedirect is not a function

Question

I am following the Auth0 quick start with Vue for my Quasar Project

MainLayout.vue

I have a login button <div><button @click="login">Log in</button></div> for this component

<script>
import { defineComponent, ref } from 'vue'
import EssentialLink from 'components/EssentialLink.vue'

export default defineComponent({
  name: 'MainLayout',

  components: {
    EssentialLink
  },

  methods: {
    login () {
      this.$auth0.loginWithRedirect();
    }
  },

  setup () {
    const leftDrawerOpen = ref(false)

    return {
      essentialLinks: linksList,
      leftDrawerOpen,
      toggleLeftDrawer () {
        leftDrawerOpen.value = !leftDrawerOpen.value
      }
    }
  }
})
</script>

src/boot/auth0.js

I tried to register the plugin to my quasar bootfile (equivalent to main.js) auth0.js

import { boot } from 'quasar/wrappers'
import { createAuth0 } from '@auth0/auth0-vue'

let auth0 =  createAuth0({
    domain: "ksadhkajshds",
    client_id: "askasahsaksj",
    redirect_uri: window.location.origin,
})

export default boot(({ app }) => {
    app.config.globalProperties.$auth0 = auth0
})

export { auth0 }

quasar.config.js

I added the bootfile to my config

// code omitted
boot: [
      
      'auth0',
      'axios',
    ],
// code omitted

Answer 1

It seems like the documentation indicates you should use app.use to register auth0 in your main.js

import { createAuth0 } from '@auth0/auth0-vue';

const app = createApp(App);
 
app.use(
  createAuth0({
    domain: "YOUR_DOMAIN",
    client_id: "YOUR_CLIENT_ID",
    redirect_uri: window.location.origin
  })
);

app.mount('#app');