I am currently in the process of integrating the angular-wizard module into my Angular application.
The Angular app was generated using yeoman. I installed the angular-wizard module using bower install angular-wizard and added it to my index.html file just above the app.js script tag alongside other modules such as angular-resource and angular-cookies.
Initially, everything seemed to be working fine. However, when I included the mgo-angular-wizard reference in the controller dependencies, the page started loading blank without any errors being displayed in the console.
For example:
'use strict';
angular.module('merlinApp', ['mgo-angular-wizard']) // this is where everything breaks
.controller('MainCtrl', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
});
In my index.html file, the scripts are included in the following order:
<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<!-- build:js scripts/modules.js -->
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-wizard/dist/angular-wizard.js"></script>
<!-- endbuild -->
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
<!-- endbuild -->