Erreur après Minification des js angulaires. Erreur: fournisseur inconnu: eProvider <- e <- makeErrorsDirective

J'ai utilisé Gulp pour minimiser mes fichiers js entiers. Une fois minifié, j'ai eu une erreur comme suit:

[$injector:unpr] Unknown provider: eProvider <- e <- makeErrorsDirective. 

J'ai eu une directive personnalisée dans mon fichier de contrôleur.

 var myhubdashboardControllers = angular.module('vpdashboardmodule', []); .directive('mhDashboard', function ($http, authService, apiService) { return { restrict: 'EA', scope: { name: '@', dash: '@', report: '@', disname: '@', disdesc: '@', distot: '@' }, templateUrl: 'views/dashboard/dashboard-direc.html', link: function (scope, element, attr) { scope.linkChk = scope.name; switch (scope.linkChk) { case 'Shipped This Week': scope.url = 'erp/JobShipmentList/PostCpsVwShipmentCount'; scope.shipstatus = "Departure"; scope.period = "ThisWeek"; scope.basicfilter = "Open"; scope.linkName = "Shipments"; scope.linkDesc = "Shipped This Week"; break; 

})};

C'est le code utilisé dans ma demande.

Il existe une raison pour laquelle vous devez injecter des services et un contrôleur dans un tableau de chaînes.

Si vous souhaitez injecter une portée sur le contrôleur, vous devez utiliser

 angular.module('yourApp') .controller('yourController',['$scope',function($scope){ }]); 

La minification modifiera les noms des variables et si vous n'utilisez pas ce groupe de chaînes lors de l'injection de services ou de contrôleurs, ce sera comme

  angular.module('yourApp') .controller('yourController',function(e){ }); 

Donc, angulaire ne sera pas capable de comprendre ce que 'e' signifie, d'où l'erreur. Rappelez-vous toujours que l'ordre est également important.

 .directive('mhDashboard', ['$http','authService','apiService', function ($http, authService, apiService) { return { restrict: 'EA', scope: { name: '@', dash: '@', report: '@', disname: '@', disdesc: '@', distot: '@' }, templateUrl: 'views/dashboard/dashboard-direc.html', link: function (scope, element, attr) { scope.linkChk = scope.name; switch (scope.linkChk) { case 'Shipped This Week': scope.url = 'erp/JobShipmentList/PostCpsVwShipmentCount'; scope.shipstatus = "Departure"; scope.period = "ThisWeek"; scope.basicfilter = "Open"; scope.linkName = "Shipments"; scope.linkDesc = "Shipped This Week"; break; } }]) 

L'angulaire ne fonctionne pas toujours bien avec la minification.

Si vous, par exemple, écrivez ceci:

 angular.controller("MyCtrl", function ($scope) {...}); 

Ensuite, la $scope serait changée en quelque chose qui n'a pas de sens lors de la minification.

Si l'on change plutôt cela pour:

 angular.controller("MyCtrl", ["$scope", function (s) {...}]); 

Alors, peu importe le premier argument dans la fonction appelée (ici s ), tant que la chaîne est "$scope" .

Consultez ceci: https://docs.angularjs.org/tutorial/step_05#a-note-on-minification dans la documentation pour plus de détails.

Si vous voulez plus d'aide, vous devez publier le code en question, pas seulement l'erreur.

J'ai eu ce même problème, même si j'utilise gulp-ng-annotate, mais cela ne se produit que pour $ stateProvider et ngDialog se résout:

 $stateProvider .state('orders', { url: '/orders', templateUrl: 'templates/orders.html', controller: 'OrdersController as vm', resolve: { authenticate: function (Auth) { return Auth.getAuthResolve(); } } }); 

Resolve doit être écrit comme ceci:

  resolve: { authenticate: ['Auth', function (Auth) { return Auth.getAuthResolve(); }] } 

Donc, il pense que ng-annotate n'injecte pas le tableau dans les résolutions, mais seulement pour les constructeurs de contrôleur / service / usine.