generator-angular-jade-stylus
generator-angular-jade-stylus copied to clipboard
grunt serve:dist breaks my app
I built an app with Yeoman, using generator-angular-jade-stylus, and everything worked perfectly in the development version using grunt serve
, not a single error in the console, but upon building the app with grunt serve:dist
, my app turns into a blank page, with the following error in the console:
66e3c8ac.vendor.js:4 Uncaught Error: Failed to instantiate module monopolyApp due to: Error: [$injector:nomod] Module 'monopolyApp' 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.2.15/$injector/nomod?p0=mon... at http://localhost:9000/scripts/66e3c8ac.vendor.js:4:12729 at http://localhost:9000/scripts/66e3c8ac.vendor.js:4:20410 at b (http://localhost:9000/scripts/66e3c8ac.vendor.js:4:19993) at http://localhost:9000/scripts/66e3c8ac.vendor.js:4:20305 at http://localhost:9000/scripts/66e3c8ac.vendor.js:4:27065 at Array.forEach (native) at f (http://localhost:9000/scripts/66e3c8ac.vendor.js:4:13059) at k (http://localhost:9000/scripts/66e3c8ac.vendor.js:4:27005) at Fa (http://localhost:9000/scripts/66e3c8ac.vendor.js:4:28542) at e (http://localhost:9000/scripts/66e3c8ac.vendor.js:4:18649)
What I have tried: I have done quite a bit of research on this error, and found a few fixes, but none of them worked for me...One of them mentioned that useminPrepare would minify the scripts, and then uglify would minify the scripts again, corrupting the scripts, and they said to remove uglify from the useminPrepare block to solve it. I tried this and it just gave me an error that it could not find the uglify task, and aborted.
I found another fix that said to change <!-- build:js scripts/vendor.js -->
to <!-- build:js(app/..) scripts/vendor.js -->
or <!-- build:js(./) scripts/vendor.js -->
-- Using this method removed the errors from the console, but still left me with a blank page.
I have the module correctly attached to the body- body(ng-app="monopolyApp")
and this is how my module is defined in the app.js:
angular .module('monopolyApp', [ 'ngCookies', 'ngResource', 'ngSanitize', 'ngRoute', 'LocalStorageModule' ])
and in the controller (main.js):
angular.module('monopolyApp') .controller('MainCtrl', function ($scope, $window, $timeout, localStorageService) {
I have also included the index.jade, app.js, and main.js in this gist for further reference. If any further information is needed to diagnose this error please let me know, but I have tried every fix I can find and nothing is working. All I can imagine is that something is going wrong in the concatenation process. Any help is appreciated, thanks!
Edit
I just tried to startup another new app, with the default template that comes after you run the generator the first time, did not edit a single line of the code, and used grunt serve:dist
and got the same blank page problem and same error in the console, so it would appear this is a problem with the generator itself and not my code.
Hi @Etregoning, I'm having the same issue. To be exact the module in my case is ngCookies, but I think it doesn't make a difference. Were you able to solve it? Thanks.
@giancarloGiuffra unfortunately no, I had to convert my jade back to html, and use the regular generator-angular. I was able to add stylus to the gruntfile myself though, but I just decided to stop using jade. I was loving it, but even for how old it is, it still has very little support. I guess people don't want to learn html preprocessors.