In an AngularJS single page application I am building, I have a grunt task that produces a separate directory which contains all the required libraries, js, css, etc. and the index.html. All the javascript code gets concatenated (not minified yet) in a single app.full.js, as well as the css code into an app.css file.
The problem I am having right now is that after the grunt tasks finishes, if I try to load the index.html in the browser then I get lots of "undefined is not a function" javascript errors in some of the components I load for the application.
The following are the scripts I load:
<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/underscore/underscore.js"></script>
<script src="bower_components/moment/moment.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/angular-ui-utils/ui-utils.js"></script>
<script src="bower_components/jquery-migrate/jquery-migrate.js"></script>
<script src="bower_components/modernizr/modernizr.js"></script>
<script src="js/libs/jquery.sparkline.js"></script>
<script src="bower_components/jquery-toggles/toggles.js"></script>
<script src="js/libs/retina.js"></script>
<script src="bower_components/flot/jquery.flot.js"></script>
<script src="bower_components/flot/jquery.flot.resize.js"></script>
<script src="bower_components/morris.js/morris.js"></script>
<script src="bower_components/raphael/raphael.js"></script>
<script src="bower_components/datatables/media/js/jquery.dataTables.js"></script>
<script src="js/libs/chosen.jquery.js"></script>
<script src="bower_components/angular-chosen-localytics/chosen.js"></script>
<script src="bower_components/jquery.gritter/js/jquery.gritter.js"></script>
<script src="bower_components/ngstorage/ngStorage.js"></script>
Some of the problematic components that produce the errors mentioned above are jquery.flot.js, morris.js (haven't tested all of them though); but I presume that I might be doing something wrong in the grunt task or maybe the order above must be changed?. The following is my grunt task:
grunt.registerTask('dev',['jshint','clean:dev','dom_munger:readcss','dom_munger:readscripts','ngtemplates','concat','copy:dev','dom_mun
ger:removecss_dev','dom_munger:addcss_dev','dom_munger:removescripts_dev','dom_munger:addscript_dev','clean:after']);
If it helps I can put the details of the dom_munger tasks or any other.
Anyone knows what might be wrong?
