Firebase n'est pas défini?
Je suis en train de travailler sur un Angulaire du projet et de l'utilisation Firebase, et c'est erroring avec ReferenceError: Firebase is not defined
, mais je n'arrive pas à comprendre pourquoi.
c'est mon index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My Contacts App</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bower_components/foundation/css/foundation.css">
<link rel="stylesheet" href="app.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="large-12 columns">
<h1>myContacts</h1>
<hr>
</div>
</div>
<div ng-view></div>
</div>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/firebase/firebase.js"></script>
<script src="bower_components/angularfire/dist/angularfire.js"></script>
<script src="bower_components/foundation/js/foundation.js"></script>
<script src="app.js"></script>
<script src="contacts/contacts.js"></script>
</body>
</html>
mon contact.js
'use strict';
angular.module('myContacts.contacts', ['ngRoute', 'firebase'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/contacts', {
templateUrl: 'contacts/contacts.html',
controller: 'ContactsCtrl'
});
}])
.controller('ContactsCtrl', ['$scope', '$firebaseArray', function($scope, $firebaseArray) {
var ref = new Firebase('https://<my_project_name>.firebaseio.com/contacts');
$scope.contacts = $firebaseArray(ref);
console.log($scope.contacts);
}]);
mon app.js
'use strict';
angular.module('myContacts', [
'ngRoute',
'firebase',
'myContacts.contacts'
]).
config(['$routeProvider', function($routeProvider) {
$routeProvider.otherwise({redirectTo: '/contacts'});
}]);
et mon colis.json
{
"name": "angular-seed",
"private": true,
"version": "0.0.0",
"description": "A starter project for AngularJS",
"repository": "https://github.com/angular/angular-seed",
"license": "MIT",
"devDependencies": {
"bower": "^1.7.7",
"http-server": "^0.9.0",
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",
"karma-chrome-launcher": "^0.2.3",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.8",
"karma-junit-reporter": "^0.4.1",
"protractor": "^3.2.2",
"shelljs": "^0.6.0",
"firebase": "*"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "http-server -a localhost -p 8000 -c-1 ./app",
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
"update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/, '//@@NG_LOADER_START@@\\n' + sed(/sourceMappingURL=angular-loader.min.js.map/,'sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map','app/bower_components/angular-loader/angular-loader.min.js') + '\\n//@@NG_LOADER_END@@', 'app/index-async.html');\""
}
}
Dans le paquet.fichier json je firebase attribué " * " les, je ne sais pas si il peut le faire? Tout le reste semble bon...
firebase à partir de la console
c'est la charmille.fichier json
{
"name": "angular-seed",
"description": "A starter project for AngularJS",
"version": "0.0.0",
"homepage": "https://github.com/angular/angular-seed",
"license": "MIT",
"private": true,
"dependencies": {
"angular": "~1.5.0",
"angular-route": "~1.5.0",
"angular-loader": "~1.5.0",
"angular-mocks": "~1.5.0",
"html5-boilerplate": "^5.3.0"
}
}
s'il pourrait y avoir à donner Firebase?
Existe-il d'autres erreurs sur la console? En particulier, le
pas de toutes les autres erreurs, et peut être consulté firebase à partir de la console, je ne sais pas quel pourrait être le problème ...
Est-il quelque chose dans votre
Je ne sais pas comment accéder à la Firebase constructeur sur la console?
Mise à niveau de firebase 3.x
firebase.js
de bower composantes de la charge? Pouvez-vous accéder à Firebase
objet à partir de la console? On dirait que vous êtes en utilisant bower
comme votre dépendance à l'gestionnaire et peut-être besoin pour exécuter bower install
. L'autre option est de passer à la npm
(et node_modules
de bower_components
) et exécuter npm install
avec votre package.json
.pas de toutes les autres erreurs, et peut être consulté firebase à partir de la console, je ne sais pas quel pourrait être le problème ...
Est-il quelque chose dans votre
index.html
qui peut inclure la contacts.js
fichier avant firebase.js
est chargé? Aussi, si vous pouvez accéder firebase
objet, vous pouvez également accéder à la Firebase
constructeur sur la console?Je ne sais pas comment accéder à la Firebase constructeur sur la console?
Mise à niveau de firebase 3.x
OriginalL'auteur sanja | 2016-06-04
Vous devez vous connecter pour publier un commentaire.
Eu le même problème.. expérience terrible..
Finalement, trouvé ceci: https://firebase.google.com/support/guides/firebase-web
OriginalL'auteur guy mograbi
Comme d'autres l'ont mentionné, vous obtenez la dernière version de Firebase (3 et plus) qui ne fonctionne pas avec les Firebase constructeur docs ici. Vous obtenez parce que dans votre
package.json
vous avez ajoutéfirebase: "*"
Vous devez les initialiser comme d'autres l'ont suggéré, et avant tout travail avec firebase est fait. Cela pourrait être quelque part mondiale, ou dans certaines config bloc (angulaire).
Après l'initialisation, vous pouvez obtenir une base de données de référence à l'aide de
Avec la nouvelle Firebase version, vous devez utiliser un compatible AngularFire version, de sorte que vous aurez besoin pour être au-dessus de 2 (confusion des versions, je sais), que vous pouvez trouver de la documentation dans leur Page GitHub.
De ne pas le voir AngularFire à tous dans votre
package.json
, ni dans vosbower.json
mais si vous travaillez avec Firebase 3.x.x, alors vous aurez besoin AngularFire 2.x.xOriginalL'auteur idan
"firebase": "*"
dans votrepackage.json
va installer la dernière firebase^3.1.0
qui n'est pas compatible avec firebase2.4.2
.La nouvelle documentation est en ici
D'ajouter et de configurer firebase dans votre index.html:
Vous pouvez générer automatiquement la config ci-dessus dans https://console.firebase.google.com/ par la création d'un nouveau projet.
new Firebase()
? il n'est toujours pas définiEt puis vous n'avez pas besoin
new Firebase()
. Vous pouvez obtenir une référence avecfirebase.database().ref()
OriginalL'auteur KB_
Soit un de la configuration suivante peut vous aider.
1) Vous pouvez inclure les éléments suivants dans votre balise de script de index.html
src="https://www.gstatic.com/firebasejs/3.1.0/firebase.js"
2) ou vous pouvez inclure les éléments suivants dans l'app.le module.ts
importation * firebase de "firebase";
Seconde syntaxe est mieux que vous n'êtes pas le codage en dur toutes les informations sur la version.
OriginalL'auteur ravi
Firebase application console
Firebase script d'initialisation
Les ajouter à votre projet de script avant à l'aide de la Firebase.
.
OriginalL'auteur M H Rahman