Angularjs: Inject Service in app.config such that it is not affected by minification

Question

I am trying to inject a service in app.config as illustrated in Inject service in app.config . However, minification breaks the app. How to overcome this?

This doesn't work with minification:

app.config(['$routeProvider',function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: function (dbService) {
                                 return dbService.getData();
                              }
                     }
        })
}]);

Answer 1

You need to inject it using the inline array annotation as stated in the angular docs.

Careful: If you plan to minify your code, your service names will get renamed and break your app.

As stated in the docs,

someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) {
  // ...
}]);

In your case,

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: ['dbService', function (dbService) {
                                 return dbService.getData();
                              }]
                     }
        })
}]);

Referenced from here: Angularjs: Inject Service in app.config such that to safeguard against minification

Answer 2

refer angular injection . try,

app.config(["$routeProvider", function ($routeProvider) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                       //Following method doesn't work with minification
                        data: function (dbService) {
                                 return dbService.getData();
                              }
                     }
        })
}]);

Answer 3

In order to safeguard against minification, one needs to array annotate the function with service dependencies.

Instead of passing just the function, pass an array with the names of the dependencies and the function.

app.config(['$routeProvider',function ($routeProvider) {
$routeProvider
    .when('/',
    {
        templateUrl: "partials/editor.html",
        controller: "AppCtrl",
        resolve: {
            //annotate this to prevent against minification
            data: ['dbService', getData]
        }
    })

    function getData (dbService) {
        return dbService.getData();
    }
}]);