admin管理员组

文章数量:1334172

I am trying to setup firebase, angularfire for my Yeoman, AngularJS Application. I followed this tutorial here () but I keep getting a

Uncaught Error: [$injector:modulerr] Failed to instantiate module MyApp due to:
Error: [$injector:modulerr] Failed to instantiate module firebase due to:
Error: [$injector:nomod] Module 'firebase' is not available! You either misspelled the m...<omitted>...1)

How do I get past this?

I believe it is these two line from the tutorial which says it downloads firebase for us but I might be putting it in the wrong place. I tried putting it inbetween the head tags, right by the bower ponents, as well as next to all my scripts

<script src='.0.15/firebase.js'></script>
<script src='.8.0/angularfire.min.js'></script>

I am trying to setup firebase, angularfire for my Yeoman, AngularJS Application. I followed this tutorial here (https://www.firebase./tutorial/#tutorial/angular/0) but I keep getting a

Uncaught Error: [$injector:modulerr] Failed to instantiate module MyApp due to:
Error: [$injector:modulerr] Failed to instantiate module firebase due to:
Error: [$injector:nomod] Module 'firebase' is not available! You either misspelled the m...<omitted>...1)

How do I get past this?

I believe it is these two line from the tutorial which says it downloads firebase for us but I might be putting it in the wrong place. I tried putting it inbetween the head tags, right by the bower ponents, as well as next to all my scripts

<script src='https://cdn.firebase./js/client/1.0.15/firebase.js'></script>
<script src='https://cdn.firebase./libs/angularfire/0.8.0/angularfire.min.js'></script>
Share Improve this question edited Jul 29, 2014 at 17:26 stcho asked Jul 29, 2014 at 17:02 stchostcho 2,1593 gold badges31 silver badges45 bronze badges 4
  • 3 Your edit is the problem. The scripts are in the right place on the page, they just aren't found on the server (what a great tutorial). If you look in the console, you'll see 404 errors. Apparently, there is no version 0.8.0 of AngularFire. If you look on their Github page, you'll see versions 0.7.1, 0.7.0, 0.6.0, 0.5.0 and so on. If you replace the 0.8.0 in the script URL with one of those versions, it should work. – Ian Commented Jul 29, 2014 at 17:10
  • @Ian regarding the tutorial now I am getting a "app/scripts/controllers/main.js line 32 col 23 'Firebase' is not defined." but I also got that from the tutorial. How should I go about getting this to work? – stcho Commented Jul 29, 2014 at 17:18
  • Here is the question for the problem stated just previously stackoverflow./questions/25021640/… – stcho Commented Jul 29, 2014 at 17:42
  • Solved it using generator-angularfire with specified versions of angularfire. More detail here github./firebase/generator-angularfire/issues/21 – stcho Commented Jul 30, 2014 at 15:59
Add a ment  | 

5 Answers 5

Reset to default 5

I had this issue and found that loading firebase, then angular, then angularfire worked fine. Like this

<head>
  <script src="https://cdn.firebase./js/client/2.2.2/firebase.js"></script>
  <script src="js/app.js"></script>
  <script src="js/controllers.js"></script>
  <script src="js/services.js"></script>
  <script src="https://cdn.firebase./libs/angularfire/1.0.0/angularfire.min.js"></script>
</head>

You need to inject the firebase module in your app as dependency injection

Somewhere in your code, you have this,

var myApp = angular.module("myApp",[]);

It should be

var myApp = angular.module("myApp",['firebase']);

This was happening to me as well.

  • I had added the angularfire dependency (bower install angularfire)

  • I had added 'firebase' into the array of dependencies when creating the module.

However, I was still getting the error "Module 'firebase' is not available".

The key was that I forgot the "--save". When I went back to my mand line and ran this:

bower install angularfire --save

then it worked!

In order to use AngularFire in a project, include the following script tags:

<!-- AngularJS -->
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.3.15/angular.min.js"></script>

<!-- Firebase -->
<script src="https://cdn.firebase./js/client/2.2.4/firebase.js"></script>

<!-- AngularFire -->
<script src="https://cdn.firebase./libs/angularfire/1.2.0/angularfire.min.js"></script>

the plete tutorial: https://www.firebase./docs/web/libraries/angular/quickstart.html

i had the same issue using node 6.10 and from the information on Uncaught ReferenceError: Firebase is not defined i tried what was suggested as follows

<head>
    <script src='https://cdn.firebase./js/client/2.2.1/firebase.js'></script>
    <script src='https://ajax.googleapis./ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <link rel='stylesheet' type='text/css' href='/resources/tutorial/css/example.css'>
  </head>

it however did not work. so what i did was to install firebase and angularfire as follows using angular-cli

npm install firebase --save
npm install angularfire --save

inside of your AppComponent file you can define the class as follows

export class AppComponent {
  ...

  constructor() {
    // Initialize Firebase
    var config = {
      apiKey: "...",
      authDomain: "...",
      databaseURL: "...",
      projectId: "...",
      storageBucket: "...",
      messagingSenderId: "..."
    };
    // firebase.initializeApp(config);
    initializeApp(config);

    // var root = firebase.database().ref();
    var firebaseRec= database().ref();

    ...
  }

}

this will solve your issue with the reference to firebase being undefined

本文标签: javascriptFirebaseAngularFire Error Module firebase is not availableStack Overflow