Минификация нарушает мой код AngularJs

Question

Я использую кассету, которая использует Microsoft Ajax Minifier для минимизации JS. Этот минимизатор переименовывает переменные, включая переменные, которые имеют особое значение для Angular, такие как $scope а также $http, Так что кассета ломает мой угловой код!

Как я могу предотвратить это?

Для справки, это угловой код, который нарушается. $scope а также $http Параметры функции переименовываются:

// <reference path="vendor/angular.js" />

angular.module('account-module', [])
    .controller('ForgottenPasswordController', function ($scope, $http) {

        $scope.email = {
            value: '',
            isValid: false,
            containerStyle: "unvalidated",
            validate: function () {
                var valid = isEmailAdressValid($scope.email.value);
                $scope.email.isValid = valid;
                $scope.email.containerStyle = valid ? "valid" : "invalid";
                return valid;
            },
            removeErrorMessage: function() {
                $scope.email.containerStyle = "unvalidated";
            }
        };

        $scope.display = {
            formClass: '',
            congratulationsClass: 'hide'
        };

        $scope.submit = function (event) {
            event.preventDefault();

            var emailValid = $scope.email.validate();
            if (emailValid) {
                $http({
                    method: 'POST',
                    url: '/account/forgot-password',
                    params: { email: $scope.email.value },
                    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
                }).success(function(data) {
                    $scope.success(data);
                }).error(function() { $scope.error(); });
            }
        };

        $scope.success = function (data) {
            switch (data.Outcome) {
                case 1:
                    $scope.display.formClass = "hide";
                    $scope.display.congratulationsClass = "";
                    break;
                case 2:
                    $scope.email.containerStyle = "invalid";
                    break; 
            }
        };

        $scope.error = function () {
            alert('Sorry, an error occurred.');
        };

        function isEmailAdressValid(emailAddress) {
            return /[^\s@]+@[^\s@]+\.[^\s@]+/.test(emailAddress);
        }
    });

Answer 1

Чтобы предотвратить разрушение вашего углового приложения минимизаторами кода, вы должны использовать синтаксис массива для определения контроллеров.

Посмотрите на http://odetocode.com/blogs/scott/archive/2013/03/13/angularjs-controllers-dependencies-and-minification.aspx

(Из OP): для справки вот измененный код:

angular.module('account-module', [])
    .controller('ForgottenPasswordController', ["$scope", "$http", function ($scope, $http) {
...
}]);

Answer 2

Я не уверен, когда Кассета добавила это, но когда вы создаете пакет, вы можете использовать AddMinified чтобы указать, что файл минимизирован настолько, насколько это возможно, не нарушая его (он не будет минимизирован, когда его обслуживают).

При этом гораздо лучше использовать синтаксис угловых массивов, потому что файлы меньшего размера лучше!