AngularJS and gulp - get fewer errors than i think i should in console
I am creating a website. I first got to know AngularJS in general and tried to comprehend everything new to me: grunt, livereload, angularjs ... I soon realized some of the mistakes I made and started building a new project from scratch.
When I was building the site while on the grunt. It displayed more messages to me than it does now using gulp. I'm not sure why this is?
For example, since I moved some existing code from my "tutorial project" to a new clean-start-gulp project. I forgot to add one service: FlashService - responsible for displaying simple messages on my site.
And I've already used this as a dependency in another service. But for some reason, all I presented was a blank site with no console messages. If in my previous project I always got messages like "No such provider" or something similar. Can anyone help me to make debugging easier?
Several other things have changed as well. I have changed the general folder structure of the code and I am trying to modulate my new application. I cannot currently think of anything else that might even be remotely related.
My current folder structure looks like this:
src/app app.js /services auth-service.js flash-service.js
Some important parts of my code:
app.js
angular.module('myapp', [
...
'myapp.home'
]).config(function ($stateProvider) {
$stateProvider.state('main', {
'abstract': true,
resolve: {
promiseUser: ['AuthService', function (AuthService) { AuthService.promiseUser; }]
},
template: '<div ui-view></div>'
});
})
AuthService
angular.module('myapp').service('AuthService', ['FlashService', function (FlashService){
// As soon as I created the missing service 'FlashService' everything started working.
// Or when I simply removed the FlashService from dependencies.
// What I don't understand is why didn't I get any errors in the console?
}
Since I've already spent too much time looking for the error in the wrong place, I can only assume that some of the other messages cannot get to the console either. This will eventually lead to debugging rather difficult.
What am I missing here? Why didn't I get any errors in the console?
Edit: The first project was created using Yeoman, and for the second I used gulp slush. Don't think it will help, but I thought it might be worth mentioning.
Edit2 Turned out that if I modify angular.js and add console.log (message) inside the first minError function, I almost get what I want.
function minErr(module) {
...
console.log(message);
return new Error(message);
}
Now I just need to figure out an alternate way to do this or what was different with the app you created, and why I am not getting these messages by default:
[$injector:unpr] Unknown provider: aProvider <- a <- AuthService
http://errors.angularjs.org/1.2.25/$injector/unpr?p0=aProvider%20%3C-%20a%20%3C-%20AuthService
source to share
Ok, so I'll try to explain what I understood.
It had nothing to do with gulp and not grunt. Also the directory structure was completely irrelevant.
Let's first look at some of the most important parts of both configuration files.
current:
angular.module('myapp', [])
.config(function ($stateProvider) {
$stateProvider.state('main', {
'abstract': true,
resolve: {
promiseUser: ['AuthService', function (AuthService) { AuthService.promiseUser; }]
},
template: '<div ui-view></div>'
});
})
...
before:
angular.module('myapp', [])
.config(function ($stateProvider) {
$stateProvider.state('main', {
'abstract': true,
resolve: {
promiseUser: ['AuthService', function (AuthService) { AuthService.promiseUser; }]
},
template: '<div ui-view></div>'
});
})
...
.run(['AuthService', function (AuthService) { ... }]);
...
So the first part is the same in both cases. What came before is that I also used AuthService inside the launcher block. I verified that when the state changed, the authenticated user had access rights to the new state.
So what happened inside the solution remained inside the solution! But what happened inside the execution block was displayed on the console.
By changing these parts of the code - both projects displayed the same errors and had the same behavior.
source to share
Loading modules with Angular if you want error messages to always try and catch. My guess is that slush gulp doesn't create a try / catch script to load the modules while yoman does. The difference between gulp and grunt shouldn't matter as long as you're trying to catch the error. The thing with gulp is that all processes are based on some process failure, sometimes the process just sits or just stops together.
Disclaimer: I have never created a slush project with only yoman.
source to share