I have a really weird problem with my google authentication client in vue3. I‘m using vue3-google-login and got everything to work.

Today when I worked on a completely different part of the app I just found out that the login page, which contains the GoogleLogin component neither shows the google login button nor the login overlay, which is weird because I didn‘t touch it at all, after I implemented it successfully. The only thing I changed project-wide is to install yarn and some packages through it. I also deleted some of the installed packages (tiptap and some extensions) again.

Does anyone have a clue how I can debug this? I got no error messages in the console and the vue dev tool states that the component is loaded.

main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import axios from 'axios'
import 'bootstrap/dist/css/bootstrap.css'
import vue3GoogleLogin from 'vue3-google-login'


axios.defaults.baseURL = process.env.NODE_ENV === 'production' ? 'https://productionApi' : 'http://192.168.2.100/api/';

createApp(App)
.use(store)
.use(router)
.use(vue3GoogleLogin, {
    clientId: 'someId'
})
.mount('#app')

import 'bootstrap/dist/js/bootstrap.js'

Login.vue

<template>
    <!-- Google Login -->
    <div v-if="loggedIn == false">
      <GoogleLogin :callback="callback" prompt/>
    </div>
    <div v-else>
      <h1>Welcome {{user.name}}</h1>
      <div @click="logout()" class="btn btn-danger">Abmelden</div>
    </div>
</template>

<script>
export default {
  data() {
    return {
      loggedIn: false,
      user: null,
      callback: (response) => {
        this.$store.dispatch('login', response)
        this.loggedIn = this.$store.getters.isLoggedIn
        console.log("logged in")
        this.$router.push('/')
      }
    }
  },
  mounted() {
    this.loggedIn = this.$store.getters.isLoggedIn
    if (this.loggedIn == true) {
      this.logout()
    }
  },
  methods: {
    logout() {
      console.log("logout")
      this.$store.dispatch('logout')
      this.loggedIn = this.$store.getters.isLoggedIn
      this.$router.push('/')
    }
  }
}
</script>