Angularjs minifier les meilleures pratiques

Je suis en train de lire http://www.alexrothenberg.com/2013/02/11/the-magic-behind-angularjs-dependency-injection.html et
il s'est avéré que angularjs l'injection de dépendance a des problèmes si vous rapetisser votre javascript
alors je me demandais si au lieu de 

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

vous devez utiliser 

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

dans l'ensemble je pensais que le deuxième extrait de code a été pour l'ancienne version de angularjs, mais ....

Dois-je toujours utiliser l'injecter façon (le deuxième) ?

InformationsquelleAutor Whisher | 2013-09-13
  1. 100

    Oui, toujours! Ainsi, de cette façon, même si votre minifer convertit $portée de la variable a et $http pour la variable b, leur identité est encore préservée dans les cordes.

    Voir cette page de AngularJS docs, faites défiler vers le bas pour Une Note sur la Minification.

    Mise à JOUR

    Alternativement, vous pouvez utiliser ng-annoter mnp paquet dans votre processus de build pour éviter cette verbosité.

    • Cette, et certaines autres questions sont très bien expliqué à la tête d'oeuf.io. JFYI
    • Yup! Beaucoup de ressources là-bas.
    • Au lieu d'utiliser cette plus détaillée de la syntaxe, vous pouvez utiliser ngmin et un outil de construction (comme Grunt) avant d'exécuter la minification. De cette façon, vous pouvez rapetisser mais également utiliser l'injection de dépendance syntaxique.
    • Une note sur la minification ont été déplacés ici docs.angularjs.org/tutorial/step_07
    • Voir aussi Guide du Développeur AngularJS - Implicite Annotation.
    InformationsquelleAutor Selvam Palanimalai
  2. 36

    Il est plus sûr d'utiliser la deuxième variante, mais il est également possible d'utiliser la première variante en toute sécurité avec ngmin.

    Mise à JOUR:

    Maintenant ng-annoter devient un nouvel outil par défaut pour résoudre ce problème.

    InformationsquelleAutor OZ_
  3. 6

    Oui, vous avez besoin d'utiliser explicite l'injection de dépendance (seconde variante). Mais depuis Angulaire 1.3.1 vous pouvez désactiver implicite l'injection de dépendance, il est vraiment utile pour résoudre les problèmes potentiels avec le renommage à la fois (avant de minification).

    Éteindre implicite DI, à l'aide de strictDi config propriété:

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

    Éteindre implicite DI, à l'aide de ng-strict-di directive:

    <html ng-app="myApp" ng-strict-di>
    InformationsquelleAutor dizel3d
  4. 6

    Juste pour signaler que si vous utilisez

    Yeoman

    il n'y a pas besoin de faire comme

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

    parce que grunt au cours de rapetisser prendre en compte la façon de gérer DI.

    InformationsquelleAutor Whisher
  5. 1

    Comme OZ_ dit, l'Utilisation des ngmin minifier tous angular js fichiers, comme directive.js service.js. Après cela, vous pouvez utiliser le compilateur de Fermeture de l'optimiser.

    ref:

    Comment minifier angularjs scripts

    Construire avec YO

    InformationsquelleAutor fxp
  6. 0

    Vous pouvez utiliser $inject comme il est mentionné ici:

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

function MyController($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .then(function(response) {
      $scope.commits = response.data
    })
}
    InformationsquelleAutor Ilia Nedoluzhko
  7. 0

    L'utilisation Stricte d'Injection de Dépendance pour Diagnostiquer les Problèmes

    Avec Implicite D'Annotation, code de pause quand minimisé.

    De la documentation:

    Implicite Annotation

    Attention: Si vous prévoyez de rapetisser votre code, votre service de noms renommés et de briser votre application.

    Vous pouvez ajouter un ng-strict-di la directive sur le même élément que ng-app d'opter pour une stricte DI mode.

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

    Mode Strict lève une erreur à chaque fois qu'un service à la tente d'utiliser implicite annotations.

    Cela peut être utile pour la détermination de la recherche des problèmes.

    Pour plus d'informations, voir

    InformationsquelleAutor georgeawg