Angular Dependency Probleme bei Minify kompilieren

Question

Ich habe eine App, die eine Menge verschiedener js-Dateien verwendet. Wenn ich die App normalerweise mit gulp kompiliere, funktioniert alles gut, aber wenn ich alles in eine Datei kompiliere, um es zu minimieren, erhalte ich einen Fehler (Uncaught Error: [$injector:modulerr]). Hier

app-55bb2aca73.js:4 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=app&p1=Error%3A%20%…http%3A%2F%2Flocalhost%3A8080%2Fbuild%2Fjs%2Fapp-55bb2aca73.js%3A4%3A30075) 
    at app-55bb2aca73.js:4 
    ... 

ist mein gulpfile.js (Verwendung Laravels elexir Plugin):

mix.scripts([ 

     /*libs*/ 
     '../../../node_modules/jquery/dist/jquery.slim.min.js', 
     '../../../node_modules/bootstrap/dist/js/bootstrap.min.js', 
     '../../../node_modules/angular/angular.min.js', 
     '../../../node_modules/angular-cookies/angular-cookies.min.js', 
     '../../../node_modules/pickadate/lib/compressed/picker.js', 
     '../../../node_modules/pickadate/lib/compressed/picker.date.js', 
     '../../../node_modules/pickadate/lib/compressed/picker.time.js', 

     'app.js', 
     'config/*.js', 
     'angular/controller/*.js' 

    ], 'public/js/app.js'); 

Hier werden die app.js:

var app = angular.module("app", ['ngCookies'], function ($interpolateProvider) { 
    $interpolateProvider.startSymbol('<%'); 
    $interpolateProvider.endSymbol('%>'); 
}); 

Zum Beispiel hier den Beginn einer Steuerung:

app.controller('someCtrl', function ($scope, $window, $http, $cookies) { 

Einige man hat eine Idee, warum das nicht in einer Datei funktioniert?

Answer 1

Beim Minimieren werden die Namen der Controller-Methoden entfernt. Sie benötigen auf diese Weise einen Verweis zu haben:

app.controller('someCtrl', ['$scope', '$window', '$http', '$cookies' 
    function ($scope, $window, $http, $cookies) { 
     // ... 
    } 
] 

Mehr hier: https://docs.angularjs.org/guide/di

Answer 2

Dies liegt möglicherweise daran, dass das System angular verwendet, um Abhängigkeiten entsprechend den Namen der als Parameter übergebenen Variablen zu injizieren. Wenn Sie Ihre Dateien in einem einzigen sind minifying und Variablen werden nicht den gleichen ursprünglichen Namen behalten, sollten Sie die Abhängigkeiten manuell wie folgt injizieren:

var myApp = function ($interpolateProvider) { 
    $interpolateProvider.startSymbol('<%'); 
    $interpolateProvider.endSymbol('%>'); 
} 
myApp.$inject = ['$interpolateProvider']; 

angular.module("app", ['ngCookies'], myApp); 

... und in Ihrem Controller:

app.controller('someCtrl', controlFn); 

var controlFn = function ($scope, $window, $http, $cookies) {}; 
controlFn.$inject = ['$scope', '$window', '$http', '$cookies'];