Как исправить ошибку форсунки после сборки углового минимума?

Question

Прежде чем говорить, я прочитал об этом, сделав рекомендации, но все же вызывая ошибку. Посмотрите на короткий код:

function IndexController($scope, $route, $routeParams, $location){ 
    $scope.sfv = project.version.name; 
} 
angular.module("TkwebMobile", ['ngRoute', 'ngCookies']) 
    .controller('IndexController', ['$scope', '$route', '$routeParams', '$location', IndexController]); 

Только это и ошибка сохраняется. Я использую grunt для «uglify», и я также использую «concat» для объединения кодов в «lib». Даже я использую «инъекцию», рекомендованную в документации «Угловая».

Это проблема хрюканья concat? (grunt-contrib-concat)

Answer 1

Это связано с вашим уточнением, в частности, с параметрами minify и mangle ваши имена переменных.

Угловое определяет, какое значение вводится в ваши функции от имени параметров. Например ...

angular.factory('MyFactory', function($location) {...}); 

... заставит угловой искать то, что зависимость называется '$location', а затем вызвать вашу функцию с $location значением, переданным в качестве его параметра.

Когда вы минимизируете свой javascript, с включенной опцией mangle, тогда имена переменных становятся искалеченными. Предыдущая функция превратится в это ...

больше

angular.factory('MyFactory', function(a) {...}); 

Угловая не имеет правильное имя параметра в исходном коде, а $location теперь a. Это экономит размер вашего javascript, но полностью уничтожает неявное разрешение зависимостей Angular. Вы можете решить это одним из двух способов.

Первый - это функция, которая угловата обеспечивает вас.

angular.factory('MyFactory', ['$location', function(a) {...}]); 

Вы обеспечиваете имена параметров в массиве с последним элементом массива, являющегося функцией, чтобы ввести параметры в. Таким образом, не имеет значения, что вы называете вашими параметрами в коде, а minifier никогда не изменит строковый литерал, поэтому Angular всегда знает, чего вы хотите.

Другой способ, если вы не хотите потерять удобство, не нужно использовать обозначение массива, чтобы отключить параметр mangle на вашем мини-блоке. Это, очевидно, означает, что вы не минимизируете в той же степени, но спросите себя, действительно ли это стоит лишних байтов.

Полушалый дом должен использовать что-то вроде ngMin, чтобы разрешить аннотацию нотации массива в ваш код, а затем продолжить с помощью мини-кода. Это лучшее из обоих мировых imo, но увеличивает сложность развертывания ваших клиентов js.

EDIT

правильные настройки, чтобы отключить MANGLE поведение в хрюкать бы это ...

uglify: { 
    options: { 
    report: 'min', 
    mangle: false 
    } 
} 

Но пакет ngAnnotate может избежать этого. См. here для получения дополнительной информации. (ngAnnotate - пакет, который взял ngMin)

Answer 2

У меня была аналогичная проблема. Оказалось, что я не правильно определял и форматировал зависимости для контроллеров и сервисов и т. Д. Я считаю, что я обнаружил это, посмотрев на вывод минимизации. (Это было грубо, позвольте мне рассказать вам.)

В основном мне приходилось просматривать все мои файлы и проверять соответствие списка зависимостей тому, что я использовал в своих контроллерах и службах. Странно, потому что он работал без изменений.

Вот пример того, что я должен был сделать:

Оригинал:

angular.module('FootCtrl', []).controller('FooterController', function($scope) { 
    $scope.footer = 'Copyright \u00A9 ' + new Date().getFullYear() + name; 
}); 

Fixed

angular.module('FootCtrl', []).controller('FooterController', ["$scope", function($scope) { 
    $scope.footer = 'Copyright \u00A9 ' + new Date().getFullYear() + name; 
}]); 

Может быть, принять к сведению, где я использую одинарные кавычки против двойные кавычки.

Надеюсь, это немного поможет. Я не уверен, есть ли у вас больше кода, чем показано, а если нет, я не уверен.

Answer 3

У меня была эта проблема, и мне потребовалось много времени, чтобы выяснить, в чем проблема, потому что я попытался отключить манипулирование именами переменных, используя $ inject array вместо просто передавая имена сервисов и провайдеров в определения функций, полагаясь на угловую неявную инъекцию зависимостей, но все же проблема сохраняется. Оказалось, что в одном из моих контроллеров, который использует IIFE, в конце отсутствовала точка с запятой. Посмотрите на код ниже.

До:

(функция() {

})()

Приведенный выше код работает нормально, прежде чем минификация благодаря автоматической вставки точек с запятой, но он ломает после минификация, поскольку отсутствие точек с запятой. Поэтому после коррекции он выглядел ниже.

Правильно:

(функция() {

})();

Это исправило мою проблему. Я надеюсь, что это может помочь кому-то Примечание: Я использую grunt useminPrepare, usemin, copy, uglify и ngAnnotate.