Question

使用vitejs，使用firebaseui的真正基本身份验证流程对我不起作用。

我的登录页面具有此组件：

<template>
  <div
    id="login"
  >
    <div
      id="firebaseui-auth-container"
    />
  </div>
</template>

<script lang="ts">
import { defineComponent, onMounted } from 'vue'
import firebase from 'firebase/app'
import * as firebaseui from 'firebaseui'
import 'firebaseui/dist/firebaseui.css'
import 'firebase/auth'

const firebaseConfig = {
  apiKey: 'AIzaSyBEJr9YYk-HUlCsQpPc7HJqf6MhzxidGSk',
  authDomain: 'hot-potatoe-4e275.firebaseapp.com',
  databaseURL: 'https://hot-potatoe-4e275.firebaseio.com',
  projectId: 'hot-potatoe-4e275',
  storageBucket: 'hot-potatoe-4e275.appspot.com',
  messagingSenderId: '200494281868',
  appId: '1:200494281868:web:7927f7805a0df9550577a9',
}

firebase.initializeApp(firebaseConfig)

const ui = new firebaseui.auth.AuthUI(firebase.auth())

export default defineComponent({
  setup() {
    onMounted(() => {
      ui.start('#firebaseui-auth-container', {
        signInSuccessUrl: '/',
        signInOptions: [
          firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        ],
      })
    })
  },
})
</script>

<style>
#login {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
</style>

当我使用vite部署它时，出现此错误：

Uncaught (in promise) TypeError: undefined is not a function
    at new wo (firebaseui.js:2296)

这很有趣，因为它可以很好地在代码沙箱中使用： https://codesandbox.io/s/rough-sun-u5hhy?file=/src/App.vue

这似乎是特定于Vite的错误。如果您愿意，可以尝试重现它：

克隆https://github.com/Septias/hot-potato.git
pnpm安装
pnpm开发人员
localhost：8080 / login

firebase / firebaseui为什么不能与vitejs一起使用？

0 个答案: