Last Updated: December 26, 2018
·
74.33K
· jaysoo

Debugging "Unknown provider" error in Angular

If your minified script is throwing an error such as:

Unknown provider: bProvider <- b <- myService

Look for your myService declaration:

angular('myModule').service('myService', function(anotherService) {
  // ...
});

What happens during minification is that anotherService argument is being minified to 'b' (or something else). Angular will try to find the 'b' service, and when that fails it will try to find the 'bProvider' to provide the service. Since neither of these are declared, you will receive the "Unknown provider" error.

To fix this, you should change all of the dependencies to strings:

angular('myModule').service('myService', ['anotherService', function(anotherService) {
  // ...
}]);

This way when minification is done, it won't mess up the dependency injection.

PS. This applies to any declaration, not just services.

7 Responses
Add your response

I'm sorry, but this is not debugging, it's solving the problem.

Debugging is trying to find out what B is - which directive, filter, module etc hasn't the dependencies set correctly and is minified into B?

over 1 year ago ·

@adria: Sure, that's fair. Unfortunately, it's hard to know what 'B' actually is. You'd have to do a search for any services that's not wrapped within an array. Or use ngmin to automatically wrap them for you.

over 1 year ago ·

I would love to know how you might tackle something like:
Error: [$injector:unpr] Unknown provider: bProvider <- b

over 1 year ago ·

@clouddueling: if you're in Chrome and you need to debug minified code, you can do two things:

1) Go to the Scripts tag in Dev Tools, and click on the pause icon to turn on "Pause on exceptions".

2) Click on the two curly braces icon to turn on "Pretty print".

Now, you should be able to see where your page is erroring out.

From what your error describes, I'm guessing it may be .config(function($routeProvider) { ...}); which got minified to .config(function(b) { ... });. Just a guess!

over 1 year ago ·

angularjs error injector unpr unknown provider sortcriteriaFilterProvider <- sortcriteriaFilter

$scope.sortcriteria = function($scope.chapters) {
    var filtered = [];
        for (var i = 0; i < $scope.chapters.length; i++) {
            var chapter = $scope.chapters[i];
            var chapterName = chapter.name;
            var n = chapterName.indexOf(":");
            if (i==(n-1)) {
                filtered.push(chapter);
            }
        }
        return filtered;
    };// this is my function in controller<span ng-repeat="chapter in chapters  | filter:sortcriteria">  this is my view file filter

unable to find the error could you help me out

over 1 year ago ·

@yadavkv

You have the filter function on the $scope, which doesn't work.

You need to wire up your module like so:

angular.module('myApp', []).filter('sortcriteria', function(chapters) {
  // ...
});
over 1 year ago ·

Thanks. Saved my issue while deploying the release version. It never shown this error in debug mode

over 1 year ago ·