Error: Uncaught Error: [$injector:modulerr]

Question

    var app = angular.module('app', ['firebase', 'ngCookies']);

app.factory("Auth", ["$firebaseAuth",
  function($firebaseAuth) {
    return $firebaseAuth();
  }
]);

app.controller("ctrlHead", ["$scope", "Auth", "$cookies",
  function($scope, Auth, $cookies) {

    if ($cookies.get('authenticated') == null) {
        $cookies.put('authenticated', false);
    }

    $scope.auth = Auth;

    $scope.auth.$onAuthStateChanged(function(firebaseUser) {

        if (firebaseUser) {
            setAppCookie();
            $cookies.put('authenticated', true);
        } else {
            $cookies.put('authenticated', false);
        }

    });
    $scope.authenticated =  $cookies.get('authenticated');  
  }
]);

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.6.0/$injector/modulerr?p0=app&p1=Error%3A%20%…0Lc%20(http%3A%2F%2Flocalhost%3A8080%2Fpublic%2Fjs%2Fangular.js%3A21%3A332)

Sajeetharan Sajeetharan · Accepted Answer · 2017-01-28T19:04:08

There is no typo, make sure you have added the firebase and angular-cookies references correctly in the following order,

<script data-require="[email protected]" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
<script data-require="[email protected]" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular-cookies.min.js"></script>
<script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/1.1.1/angularfire.min.js"></script>
<script src="app.js"></script>

DEMO

var app = angular
  .module('testApp', [
    'ngCookies',
    'firebase'
  ])
 app.constant('FIREBASE_URL', 'https://testapp1000.firebaseio.com/')
   
app.controller("ctrlHead", ["$scope",
  function($scope) {
   $scope.message = "angular firebase and cookies";
    }
]);

<!DOCTYPE html>
<html>
 <head>
    <link data-require="[email protected]" data-semver="3.3.2" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
  </head>
  <body ng-app="testApp" ng-controller="ctrlHead">
   <h1>{{message}}</h1>
    
  <script data-require="[email protected]" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
    <script data-require="[email protected]" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular-cookies.min.js"></script>
    <script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/1.1.1/angularfire.min.js"></script>
  </body>
</html>

Error: Uncaught Error: [$injector:modulerr]

1 Answers