Angularjs минимизировать лучшую практику

Я читаю http://www.alexrothenberg.com/2013/02/11/the-magic-behind-angularjs-dependency-injection.html и оказалось, что у внедрения angularjs есть проблемы, если вы минимизируете свой JavaScript, поэтому я мне интересно, если вместо

var MyController = function($scope, $http) {
    $http.get('https://api.github.com/repos/angular/angular.js/commits')
      .success(function(commits) {
        $scope.commits = commits
      })
  }

ты должен использовать

var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .success(function(commits) {
      $scope.commits = commits
    })
}]

all in all I thought the second snippet was for the old version of angularjs but....

Should I always use the inject way (the second one)?

Источник

6 ответов

Решение

Да всегда! Таким образом, даже если ваш минифер преобразует $scope в переменную a и $http в переменную b, их идентичность все еще сохраняется в строках.

См. Эту страницу документации AngularJS, прокрутите вниз до заметки о минификации.

ОБНОВИТЬ

Кроме того, вы можете использовать пакет ng-annotate npm в процессе сборки, чтобы избежать этого многословия.

Источник

Безопаснее использовать второй вариант, но также можно безопасно использовать первый вариант с помощью ngmin.

ОБНОВИТЬ:
Теперь ng-annotate становится новым инструментом по умолчанию для решения этой проблемы.

Источник

Да, вам нужно использовать явное внедрение зависимостей (второй вариант). Но, поскольку в Angular 1.3.1 вы можете отключить неявное внедрение зависимостей, действительно полезно решить потенциальные проблемы с переименованием сразу (до минификации).

Отключение неявного DI, используя strictDi свойство config:

angular.bootstrap(document, ['myApp'], {
    strictDi: true
});

Отключение неявного DI, используя ng-strict-di директива:

<html ng-app="myApp" ng-strict-di>
Источник

Просто чтобы указать, что если вы используете

йомен

нет необходимости делать как

var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .success(function(commits) {
      $scope.commits = commits
    })
}]

потому что ворчание во время минификации учитывает, как управлять DI.

Источник

Как сказал OZ_, используйте ngmin для минимизации всех угловых js-файлов, таких как directive.js service.js. После этого вы можете использовать компилятор Closure для его оптимизации.

ссылка:

Как минимизировать скрипты angular js

Строй с ВАМИ

Источник

Используйте строгое внедрение зависимостей для диагностики проблем

При использовании неявной аннотации код при минификации сломается.

Из Документов:

Неявная аннотация

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

Вы можете добавить ng-strict-di директива для того же элемента, что и ng-app чтобы выбрать строгий режим DI.

<body ng-app="myApp" ng-strict-di>

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

Это может быть полезно для определения проблем.

Для получения дополнительной информации см.

Источник

Вы можете использовать $inject как уже упоминалось здесь:

MyController.$inject = ['$scope', '$http'];

function MyController($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .success(function(commits) {
      $scope.commits = commits
    })
}
Источник
Другие вопросы по тегам