Javascript '；firebase'；未定义-Vue.js

我使用firebase登录用户，但控制台抱怨firebase未定义。 我正在导入，firebase，我已经根据firebase提供给您的文档正确设置了配置，但仍然没有运气

import Vue from 'vue'
import App from './App.vue'
import VeeValidate from 'vee-validate';
import router from './router';
import firebase from 'firebase';
Vue.use(VeeValidate);
Vue.config.productionTip = false
// Initialize Firebase
 var config = {
   apiKey: "<my api key>",
   authDomain: "<my auth domain>",
   databaseURL: "<my database url>",
   projectId: "todo-bb5d3",
   storageBucket: "",
   messagingSenderId: "638496899966"
 };
 firebase.initializeApp(config);


new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

从“Vue”导入Vue
从“./App.vue”导入应用程序
从“vee validate”导入vee validate；
从“./router”导入路由器；
从“firebase”导入firebase；
Vue.使用（验证）；
Vue.config.productionTip=false
//初始化Firebase
变量配置={
apiKey:“，
authDomain:“”，
数据库URL:“”，
projectId:“todo-bb5d3”，
storageBucket:“”，
messagingSenderId：“638496899966”
};
firebase.initializeApp（配置）；
新Vue({
路由器，
渲染：h=>h（应用程序）
}).$mount（“#应用程序”）

导致问题的文件：

<template>
    <div class="LogIn">
      <h3>Sign Up</h3>
      <input type="email" v-model="email" placeholder="email" name="" value="">
      <input type="passeord" v-model="password" placeholder="password" name="" value="">
      <button v-on:click="signUp" type="button" name="button">Sign Up</button>
    </div>
</template>


<script>
  export default{
    name: 'LogIn',
    data: function() {
      return{
        email: '',
        password: ''
      }
    },
    methods: {
      signUp: function(){
        firebase.auth().createUserWithEmailAndPassword(this.email, this.password).then(
          function(user){
            alert('Your account has been created')
          },
          function(err) {
            alert('Opps! ' + err.message)
          }
        )
      }
    }
  }
</script>

注册
注册
导出默认值{
名称：'登录'，
数据：函数（）{
返回{
电子邮件：“”，
密码：“”
}
},
方法：{
注册：函数（）{
firebase.auth（）.createUserWithEmailAndPassword（this.email，this.password）。然后(
功能（用户）{
警报（'您的帐户已创建'）
},
功能（err）{
警报（'Opps！'+错误消息）
}
)
}
}
}

您必须在“导致问题的文件”中导入firebase

---

将api密钥粘贴到此处也不是一个好主意，即使对于测试应用程序，我建议您编辑帖子并对其进行修订。

一个解决方案是在创建的

实例生命周期挂钩中按如下方式初始化它：

new Vue({
  router,
  render: h => h(App),
  created() {
    firebase.initializeApp(
      {
        apiKey: "...",
        authDomain: "....",
        databaseURL: "..."
        ...
      }
    )
  }
}).$mount('#app')

new Vue({
  router,
  render: h => h(App),
  created() {
    firebase.initializeApp(
      {
        apiKey: "...",
        authDomain: "....",
        databaseURL: "..."
        ...
      }
    )
  }
}).$mount('#app')