繁体   English   中英

VueJS Firebase app导出默认错误的问题

[英]VueJS Firebase app problem of export default error

我正在尝试使用 vue 2 和 firebase 最新创建 crud 应用程序,这是我的 firebase.js 文件

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/firestore'


const firebaseConfig = {
   stuff
  };

firebase.initializeApp(firebaseConfig);
const database = firebase.firestore()
const auth = firebase.auth()

const usersCollection = database.collection('users')

export{
 
    database,
    auth,
    usersCollection
}

这是我的 store/index.js 文件

import Vue from "vue";
import Vuex from "vuex";
import fb from "../../firebase"

import router from "../router";
Vue.use(Vuex);

export default new Vuex.Store({
  state: {
   userProfile:{}
  },
  
  mutations: {
   
    setUserProfile(state,val)
    {
      state.userProfile=val
    },
    setPerformingRequest(state,val)
   {
     state.performingRequest=val
   }
  },
  actions: {

    async login({dispatch},form)
    {
      const{user} = await fb.auth().signInWithEmailAndPassword(form.email,form.password)
      dispatch('fetchUserProfile',user)
    },


    async signUp({dispatch},form)
    {

       const {user} = await fb.auth().createUserWithEmailAndPassword(form.email,form.password)

      //  create user object in userCollection

      await fb.usersCollection.doc(user.uid).set({
        firstName:form.firstName,
        middleName:form.middleName,
        lastName:form.lastName,
        email:form.email,
        password:form.password,
        gender:form.gender,
        age:form.user_age
      })

      dispatch('fetchUserProfile',user)

    },

    async fetchUserProfile({commit},user)
    {
      // fetching user profile data into constant named userProfile
      const userProfile = await fb.usersCollection.doc(user.uid).get()

      // setting the fetched data from firebase to state of userProfile
      commit('setUserProfile',userProfile.data())

      // now changing route to dashboard

      if(router.currentRoute.path ==='/')
      {
        router.push('/Dashboard')
      }

    },
  
    async logOut({commit})
    {
          
      // log user out
      await fb.auth.signOut()

      //  clear user data from state

      commit('setUserProfile',{})

      // changing route to homepage
      router.push('/')
    }



  },
  modules: {},
});

应用程序在浏览器控制台中运行时出现警告Uncaught (in promise) TypeError: firebase__WEBPACK_IMPORTED_MODULE_4 _.default is undefined and in vs code terminal
“在'../../firebase'中找不到导出'default'(导入为'fb')
因此,既没有用户注册,也没有创建文档
有谁知道如何做到这一点?

更改为

const fb = require('../../firebase.js');

或者

import { auth, usersCollection } from "../../firebase";   

在商店文件中应该可以解决问题。


在第一种情况下,您还需要更改

await fb.auth().createUserWithEmailAndPassword

await fb.auth.createUserWithEmailAndPassword

在第二种情况下,改变

await fb.auth().createUserWithEmailAndPassword

await auth.createUserWithEmailAndPassword

在这种情况下,还要注意,如果您要在store/index.js文件中使用database ,您还需要导入database ,例如:

import { database, auth, usersCollection } from "../../firebase"; 

更多解释herehere

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM