新しい Polymerfire<firebase-app>
要素を (Polymer 1.x + Firebase 3.x) プロジェクトに追加したところ、プロジェクトがクラッシュしました。localhost でホーム画面が読み込まれることを期待していましたが、代わりに空白の画面とコンソール エラーが表示されます。
<firebase-app auth-domain="my-app-id.firebaseapp.com"
database-url="https://my-app-id.firebaseio.com/"
api-key="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx">
</firebase-app>
コンソール ログに次のエラーが報告されます。
Console.logfirebase-app.html:94
Uncaught ReferenceError: firebase が定義されていません
関連するコード行 (行番号 94) は次のとおりです。
firebase-app.html、94行目firebase.initializeApp.apply(firebase, init); // Line 94, highlighted error
firebase-app 要素のソース コード全体は、こちらにあります。
https://github.com/firebase/polymerfire/blob/master/firebase-app.html<!--
@license
Copyright 2016 Google Inc. All Rights Reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file or at
https://github.com/firebase/polymerfire/blob/master/LICENSE
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="firebase.html">
<dom-module id="firebase-app">
<script>
(function() {
'use strict';
/**
* The firebase-app element is used for initializing and configuring your
* connection to firebase.
*/
Polymer({
is: 'firebase-app',
properties: {
/**
* The name of your app. Optional.
*
* You can use this with the `appName` property of other Polymerfire elements
* in order to use multiple firebase configurations on a page at once.
* In that case the name is used as a key to lookup the configuration.
*/
name: {
type: String,
value: ''
},
/**
* Your API key.
*
* Get this from the Auth > Web Setup panel of the new
* Firebase Console at https://console.firebase.google.com
*
* It looks like this: 'AIzaSyDTP-eiQezleFsV2WddFBAhF_WEzx_8v_g'
*/
apiKey: {
type: String
},
/**
* The domain name to authenticate with.
*
* The same as your Firebase Hosting subdomain or custom domain.
* Available on the Firebase Console.
*
* For example: 'polymerfire-test.firebaseapp.com'
*/
authDomain: {
type: String
},
/**
* The URL of your Firebase Realtime Database. You can find this
* URL in the Database panel of the Firebase Console.
* Available on the Firebase Console.
*
* For example: 'https://polymerfire-test.firebaseio.com/'
*/
databaseUrl: {
type: String
},
/**
* The Firebase app object constructed from the other fields of
* this element.
*/
app: {
type: Object,
notify: true,
computed: '__computeApp(name, apiKey, authDomain, databaseUrl)'
}
},
__computeApp: function(name, apiKey, authDomain, databaseUrl) {
if (apiKey && authDomain && databaseUrl) {
var init = [{
apiKey: apiKey,
authDomain: authDomain,
databaseURL: databaseUrl
}];
if (name) {
init.push(name);
}
firebase.initializeApp.apply(firebase, init);
} else {
return null;
}
return firebase.app(name);
}
});
})();
</script>
</dom-module>