我查看了以下问题，但未能找到有效的解决方案，因此我发布另一个问题。
Ionic + firebase, error Module 'firebase' is not available
Firebase, AngularFire Error: Module firebase is not available
Angularfire 'Firebase' is not defined
我是个初学者，这是我第一个使用 Firebase 的 Ionic 应用。我只是想让 Firebase 正确加载。我已在我的 index.html 中包含以下 CDN:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!--firebase-->
<script src="https://cdn.firebase.com/js/client/2.2.1/firebase.js"></script>
<!--angularfire-->
<script src="https://cdn.firebase.com/libs/angularfire/1.0.0/angularfire.min.js"></script>
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter">
<!--
The nav bar that will be updated as we navigate between views.
-->
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<!--
The views will be rendered in the <ion-nav-view> directive below
Templates are in the /templates folder (but you could also
have templates inline in this html file if you'd like).
-->
<ion-nav-view></ion-nav-view>
</body>
</html>
app.js:
angular.module('starter', ['ionic', 'firebase', 'starter.controllers', 'starter.services'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleLightContent();
}
});
})
.config(function($stateProvider, $urlRouterProvider) {
// Ionic uses AngularUI Router which uses the concept of states
// Learn more here: https://github.com/angular-ui/ui-router
// Set up the various states which the app can be in.
// Each state's controller can be found in controllers.js
$stateProvider
// setup an abstract state for the tabs directive
.state('tab', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
// Each tab has its own nav history stack:
.state('tab.login', {
url: '/login',
views: {
'tab-login': {
templateUrl: 'templates/tab-login.html',
controller: 'LoginCtrl'
}
}
})
.state('tab.new', {
url: '/new',
views: {
'tab-new': {
templateUrl: 'templates/tab-new.html',
controller: 'NewCtrl'
}
}
})
.state('tab.home', {
url: '/home',
views: {
'tab-home': {
templateUrl: 'templates/tab-home.html',
controller: 'HomeCtrl'
}
}
})
.state('tab.profile', {
url: '/profile',
views: {
'tab-profile': {
templateUrl: 'templates/tab-profile.html',
controller: 'ProfileCtrl'
}
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/tab/home');
});
controller.js:
angular.module('starter.controllers', ['ionic', 'firebase', 'starter.services'])
.controller('LoginCtrl', function($scope) {
})
.controller('NewCtrl', function($scope) {})
.controller('HomeCtrl', function($scope, Chats) {
$scope.chats = Chats.all();
$scope.remove = function(chat) {
Chats.remove(chat);
}
})
.controller('ProfileCtrl', function($scope) {
$scope.settings = {
enableFriends: true
};
});
使用此代码，我收到错误:
Uncaught ReferenceError: angular is not defined(anonymous function) @ angularfire.min.js:12(anonymous function) @ angularfire.min.js:12
ionic.bundle.js:8762 Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module firebase due to:
Error: [$injector:nomod] Module 'firebase' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.13/$injector/nomod?p0=firebase
at REGEX_STRING_REGEXP (http://localhost:8100/lib/ionic/js/ionic.bundle.js:8762:12)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:10466:17
at ensure (http://localhost:8100/lib/ionic/js/ionic.bundle.js:10390:38)
at module (http://localhost:8100/lib/ionic/js/ionic.bundle.js:10464:14)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:12796:22
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:9022:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:12780:5)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:12797:40
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:9022:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:12780:5)
http://errors.angularjs.org/1.3.13/$injector/modulerr?p0=firebase&p1=Error%…%3A%2F%2Flocalhost%3A8100%2Flib%2Fionic%2Fjs%2Fionic.bundle.js%3A12780%3A5)
at REGEX_STRING_REGEXP (http://localhost:8100/lib/ionic/js/ionic.bundle.js:8762:12)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:12819:15
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:9022:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:12780:5)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:12797:40
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:9022:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:12780:5)
at createInjector (http://localhost:8100/lib/ionic/js/ionic.bundle.js:12706:11)
at doBootstrap (http://localhost:8100/lib/ionic/js/ionic.bundle.js:10144:20)
at bootstrap (http://localhost:8100/lib/ionic/js/ionic.bundle.js:10165:12)
http://errors.angularjs.org/1.3.13/$injector/modulerr?p0=starter&p1=Error%3…3A%2F%2Flocalhost%3A8100%2Flib%2Fionic%2Fjs%2Fionic.bundle.js%3A10165%3A12)
我没有包含 Angular CDN，因为 ionic 包含它。 我已经在 firebase 上创建了一个新应用，并且可以通过 firebase 仪表板访问它。
有什么想法可以让 Firebase 正确启动并运行吗？
最佳答案
您需要将 ionic.bundle.js 移动到 angularfire.min.js 之前，因为 Angular fire.js 在创建模块时使用 Angular 对象并且抛出错误.
关于javascript - 使用 Ionic - 无法正确加载 Firebase - 错误 : Module 'firebase' is not available，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30549828/