CODEWITHSUNDEEP
angularjs
Kalpesh
Kalpesh

Reputation: 63

unknown provider after minify angular js

I have created angular app and I want to deploy it in production I have minified whole angular app using gulp-uglyfy after minify whole app I got error of unknown provider for authInterceptor here is my authInterceptor 

(function () {
'use strict';
angular.module('competitiveMain', [
    "ui.router",
    "ui.bootstrap",
    "oc.lazyLoad",
    "ngSanitize",
    "ngCookies",
    "pascalprecht.translate",
    "ngStorage",
    "timer",
    "competitiveAdmin",
    "smart-table",
    "toastr"
]).factory('authInterceptor', function ($rootScope, $q, $cookieStore, $location) {
    return {
        // Add authorization token to headers
        request: function (config) {
            config.headers = config.headers || {};
            if ($cookieStore.get('user')) {
                config.headers.Authorization = $cookieStore.get('user').token;
            }
            return config;
        },

        // Intercept 401s and redirect you to login
        responseError: function (response) {
            if (response.status === 401) {
                $location.path('/');
                // remove any stale tokens
                $cookieStore.remove('user');
                return $q.reject(response);
            }
            else {
                return $q.reject(response);
            }
        }
    };
})
    .config(['$httpProvider', function ($httpProvider) {
        //Http Interceptor to check auth failures for xhr requests
        $httpProvider.interceptors.push('authInterceptor');
    }]);

})();

Can someone suggest me why this happening after minifying js?

Upvotes: 1

Views: 357

Answers (2)

Max Zuber
Max Zuber

Reputation: 19

Here is the link to AngularJS style guide and there is an explanation why it's happening.

https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#manual-annotating-for-dependency-injection

So change your factory to:

.factory('authInterceptor', authInterceptor);

authInterceptor.$inject = ["$rootScope", "$q", "$cookieStore", "$location"];

function authInterceptor($rootScope, $q, $cookieStore, $location)
{
    ...
}

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222682

It is a common issue, always make sure when you pass dependencies that you include the dependency names as strings so that Angular will know what to inject after minification

Change your factory code as follows,

.factory('authInterceptor', ['$rootScope', '$q','$cookieStore','$location', function ($rootScope, $q, $cookieStore, $location) {
}]);

Upvotes: 1

Related Questions