（WebPACKの）VUE-CLI経由vuejs2アプリでfirebaseを使用して

Question

私は私が私の中にFirebaseをインポートするために、これを行っているvueapp のための私のデータベースとしてfirebaseを使用したいVUE-CLI WebPACKのテンプレート を使用してに新しいですアプリ

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) 
}) 

は今私のsignup.vueファイルに私は

再び、次のインポートする必要があります私の方法で次のように使用するためには0

は

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

私の質問は、私のようなfirebase関連メソッドを使用するためにどこにでも（IEでalll VUEのコンポーネントのスクリプトタグを

import * as firebase from 'firebase' 

を輸入しなければならないのです

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

または私は1つの中央の場所でそれをインポートし、を使用することができます

Answer 1

あなたはVue.prototypeにfirebaseを添付することができます：

import * as firebase from 'firebase' 

let config = { 
    // 
} 

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

new Vue({ 
    // 
}) 

そこで、このようなコンポーネントにそれを使用する：

this.$firebase.database() 

Answer 2

あなたは一度だけ、それをインポートしたい場合、あなたは単にあなたのmain.jsに行うことができます。

import * as firebase from 'firebase' 

window.firebase = firebase 

windowオブジェクトは、Webページのためのグローバルであり、それはこのようにそれを使用するために、通常の練習です。