Mit Feuerbasis in vuejs2 App über vue-cli (webpack)

Question

Ich bin neu in mit vue-cli eine webpack Vorlage Ich möchte ich das Firebase zu importieren getan haben für die vueapp Feuerbasis als meine Datenbank verwenden, um in meine App

main.js

//imported rest all required packages just dint mention here 
import * as firebase from 'firebase' 

let config = { 
apiKey: " - XXXXXXXXCXCC", 
authDomain: "XXXXXXXXX", 
databaseURL: "XXXXXCCCX", 
storageBucket: "XXXXXXXXXXX", 
messagingSenderId: "XXXXXXXXXX" 
}; 

firebase.initializeApp(config); 

new Vue({ 
el: '#app', 
router, 
store, 
render: h => h(App) 
}) 

jetzt in meiner signup.vue Datei ich habe folgendes wieder

importieren 0

Um den folgend in meinen Methoden

firebase.auth().createUserWithEmailAndPassword(uEmail, uPassword).catch(function(error) { 
       // Handle Errors here. 
       var errorCode = error.code; 
       var errorMessage = error.message; 
       // ... 
      }); 

Meine Frage zu verwenden, ist i

import * as firebase from 'firebase' 

überall (dh in alll vue Komponenten Script-Tags verwenden Feuerbasis verwandte Methoden importieren zu tun haben wie

firebase.auth() 
firebase.database() 
firebase.storage() 

oder kann ich importieren es an einem zentralen Ort und nutzen firebase.method() in any vue component file when needed

Answer 1

Sie könnten befestigen die firebase auf die Vue.prototype:

import * as firebase from 'firebase' 

let config = { 
    // 
} 

Vue.prototype.$firebase = firebase.initializeApp(config) 

new Vue({ 
    // 
}) 

Dann verwenden Sie es auf die Komponenten wie folgt aus:

this.$firebase.database() 

Answer 2

Wenn Sie es nur einmal importieren möchten, können Sie einfach in Ihrem main.js tun:

import * as firebase from 'firebase' 

window.firebase = firebase 

window Objekt für die Homepage global ist, und es ist üblich, es auf diese Weise zu verwenden.