Firebase，AngularFire 错误：模块 firebase 不可用答案

【问题标题】：Firebase, AngularFire Error: Module firebase is not availableFirebase，AngularFire 错误：模块 firebase 不可用
【发布时间】：2014-07-29 17:02:56
【问题描述】：

我正在尝试为我的 Yeoman AngularJS 应用程序设置 firebase、angularfire。我在这里学习了本教程 (https://www.firebase.com/tutorial/#tutorial/angular/0)，但我一直收到一个

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)

我该如何克服这个问题？

我相信是教程中的这两行说它为我们下载了 firebase，但我可能把它放在了错误的地方。我试着把它放在头标签之间，就在凉亭组件旁边，以及我所有的脚本旁边

<script src='https://cdn.firebase.com/js/client/1.0.15/firebase.js'></script>
<script src='https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.min.js'></script>

【问题讨论】：

您的编辑是问题所在。脚本位于页面上的正确位置，只是在服务器上找不到它们（多么棒的教程）。如果您查看控制台，您会看到 404 错误。显然，AngularFire 没有 0.8.0 版本。如果你查看他们的 Github 页面，你会看到 0.7.1、0.7.0、0.6.0、0.5.0 等版本。如果您将脚本 URL 中的 0.8.0 替换为其中一个版本，它应该可以工作。
@Ian 关于教程现在我得到一个“app/scripts/controllers/main.js line 32 col 23 'Firebase' is not defined。”但我也从教程中得到了这一点。我应该如何让它发挥作用？
这里是刚才提到的问题stackoverflow.com/questions/25021640/…
使用 generator-angularfire 和指定版本的 angularfire 解决了这个问题。更多细节在这里github.com/firebase/generator-angularfire/issues/21

标签： javascript angularjs firebase yeoman angularfire

【解决方案1】：

我遇到了这个问题，发现加载 firebase，然后是 angular，然后是 angularfire 工作正常。像这样

<head>
  <script src="https://cdn.firebase.com/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.com/libs/angularfire/1.0.0/angularfire.min.js"></script>
</head>

【讨论】：

【解决方案2】：

你需要在你的应用中注入firebase模块作为依赖注入

在你的代码的某个地方，你有这个，

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

应该是

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

【讨论】：

我已经在我的 app.js 和 main.js 中尝试过，但它仍然显示相同的错误。但是，在这两个文件中，我看不到“var myApp =”，该语法通常在哪里？
除非我的 app.js、main.js 以外的其他地方有不同的 'var myApp = ...'，否则这个答案并没有解决我的问题。

【解决方案3】：

这也发生在我身上。

我添加了 angularfire 依赖项（bower install angularfire）
我在创建模块时已将“firebase”添加到依赖项数组中。

但是，我仍然收到错误消息“模块 'firebase' 不可用”。

关键是我忘记了“--save”。当我回到我的命令行并运行这个时：

bower install angularfire --save

然后就成功了！

【讨论】：

【解决方案4】：

为了在项目中使用 AngularFire，请包含以下脚本标签：

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

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

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

完整教程：https://www.firebase.com/docs/web/libraries/angular/quickstart.html

【讨论】：

【解决方案5】：

我在使用节点 6.10 和 Uncaught ReferenceError: Firebase is not defined 上的信息时遇到了同样的问题我尝试了以下建议

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

但是它没有工作。所以我所做的是使用 angular-cli 如下安装 firebase 和 angularfire

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

在您的 AppComponent 文件中，您可以按如下方式定义类

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();

    ...
  }

}

这将解决您对 firebase 的引用未定义的问题

【讨论】：