FirebaseをホスティングしてFirebaseを使用する

Question

"反応するアプリケーションを作成する"（https://github.com/facebookincubator/create-react-app）で作成されたReactアプリケーションを開発しています。 私は必要

<script src="/__/firebase/init.js"></script> 

（私はdevのプロジェクトといくつかの生産プロジェクトを持っている）これは、ホスティングFirebaseでホストされ、私は複数のプロジェクトを展開し、ドキュメント（https://firebase.google.com/docs/web/setup#sdk_imports_and_implicit_initialization）で説明するように、暗黙的な初期化を使用したいでしょう私のReactコンポーネントで上記のスクリプトで初期化された "firebase"オブジェクトを取得します。それを複数のReactコンポーネントファイルにどのようにインポートする必要がありますか？ 私は開発中、私は私のindex.htmlに

<script src="https://www.gstatic.com/firebasejs/4.1.1/firebase.js"></script> 
<script> 
    // Initialize Firebase 
    // TODO: Replace with your project's customized code snippet 
    var config = { 
    apiKey: "<API_KEY>", 
    authDomain: "<PROJECT_ID>.firebaseapp.com", 
    databaseURL: "https://<DATABASE_NAME>.firebaseio.com", 
    storageBucket: "<BUCKET>.appspot.com", 
    messagingSenderId: "<SENDER_ID>", 
    }; 
    firebase.initializeApp(config); 
</script> 

コードを追加しようとしているので、私は開発中の「サーブfirebase」とそれを果たすとするとき、私はそれを展開するときに、これが唯一利用可能になることを承知していますFirebaseのドキュメントに記述されているようにしてください。しかし、ReactComponentでFirebaseをインポートしようとすると、それが見つからない、またはプロジェクトが初期化されないという不満があります（htmlタグで何をしているのか）。

htmlからFirebaseの初期化されたAppライブラリとFirebaseライブラリをインポートするにはどうすればいいですか？スクリプトタグ??

Answer 1

firebaseパッケージをnpmでインストールしてみてください。あなたがいずれかで好きな場所、あなたは簡単にまた、あなたは、いくつかのconfigsでfirebaseアプリを初期化することができ、いくつかのconfigureFirebase.jsファイルにfirebaseをインポートすることができ

import firebase from 'firebase'; 

にインポートすることで、コンポーネントを反応させ、その後、設定さfirebaseインスタンスをエクスポートし、これを使用して、それを使用することができますいずれかのコンポーネントでインスタンス

ITSは参考になる：

import firebase from 'firebase' 
const config = { /* COPY THE ACTUAL CONFIG FROM FIREBASE CONSOLE */ 
    apiKey: "unreadablestuff", 
    authDomain: "your-domain-name.firebaseapp.com", 
    databaseURL: "https://your-domain-name.firebaseio.com", 
    storageBucket: "your-domain-name.appspot.com", 
    messagingSenderId: "123123123123" 
}; 
const fire = firebase.initializeApp(config); 
export default fire;