Angulaire.module de minification bug

Problème

De AngularJS: Les Mauvaises Parties:

Angulaire a une construite dans la dépendance de l'injecteur qui va passer appropriée
les objets à votre fonction basée sur les noms de ses paramètres:

function MyController($scope, $window) {
    //...
}

Ici, les noms des paramètres $scope et $window sera
comparée à une liste de noms connus, et correspondant à des objets
instancié et transmis à la fonction. Angulaire obtient le paramètre
les noms en appelant toString() sur la fonction, puis l'analyse de la
définition de la fonction.

Le problème avec cela, bien sûr, c'est qu'il arrêts de travail de l'
moment vous rapetisser votre code. Depuis que vous vous souciez de l'expérience utilisateur
vous serez minifying votre code, utilisant ainsi ce DI, le mécanisme de
pause votre application. En fait, une commune de la méthodologie de développement est d'utiliser
unminified code en développement afin de faciliter le débogage, puis à rapetisser
le code lorsque l'on pousse à la production ou à la mise en scène. Dans ce cas, ce
problème ne sera pas l'arrière de sa tête hideuse jusqu'à ce que vous êtes au point où il
fait le plus mal.

(...)

Depuis cette injection de dépendance mécanisme ne fait pas travailler dans le
cas général, Angulaire fournit également un mécanisme qui ne. Pour être sûr,
il fournit deux. Vous pouvez passer un tableau comme ceci:

module.controller('MyController', ['$scope', '$window', MyController]);

Ou vous pouvez définir la $inject bien sur votre constructeur:

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

Solution

Vous pouvez utiliser ng-annoter automatique de l'ajout d'annotations requises pour les minifying:

ng-annotate ajoute et supprime des AngularJS l'injection de dépendance
les annotations. Il est non-intrusive de sorte que votre code source reste exactement le
même le contraire. Pas perdu commentaires ou des lignes déplacées.

ng-annotate est plus rapide et plus stable que ngmin (qui est maintenant obsolète) et il y a des plugins pour de nombreux outils:

• grunt-ng-annoter
• gulp-ng-annoter
• browserify-annoter

À partir de AngularJS 1.3 il y a aussi un nouveau param dans ngApp appelé ngStrictDi:

si cet attribut est présent sur l'application de l'élément, l'injecteur sera
créé en "strict-di" mode. Cela signifie que l'application ne pourra pas
pour appeler des fonctions qui ne sont pas de l'utilisation explicite de la fonction d'annotation (et
sont donc impropres à minification), comme décrit dans la La dépendance
L'Injection de guide et l'utilité des informations de débogage aidera dans le suivi
en bas de la racine de ces bugs.

J'ai eu un problème similaire, à l'aide de grunt, ngmin et uglify.

J'ai couru le processus dans cet ordre: concat, ngmin, uglify

J'ai pu continuer à obtenir le $injecteur erreur angulaire jusqu'à ce que j'ai ajouté dans la uglify options de mutilation: faux - ensuite, tout s'est arrangé.

J'ai aussi essayé d'ajouter les exceptions uglify comme ceci:

 options: {
  mangle: {
     except: ['jQuery', 'angular']
  }
}

Mais en vain...

Voici mon gruntFile.js pour plus de précisions:

module.exports = function(grunt) {
'use strict';
//Configuration goes here
grunt.initConfig({
pkg: require('./package.json'),
watch: {
files: ['scripts/**/*.js', 'test/**/*spec.js', 'GruntFile.js'],
tasks: ['test', 'ngmin']
},
jasmine : {
//Your project's source files
src : ['bower_components/angular/angular.js', 'bower_components/angular-mocks/angular-mocks.js', 'scripts/app.js', 'scripts/**/*.js' ],
//Your Jasmine spec files
options : {
specs : 'test/**/*spec.js',
helpers: 'test/lib/*.js'
}
},
concat: {
dist : {
src: ['scripts/app.js', 'scripts/**/*.js'],
dest: 'production/js/concat.js'
}
},
ngmin: {
angular: {
src : ['production/js/concat.js'],
dest : 'production/js/ngmin.js'
}
},
uglify : {
options: {
report: 'min',
mangle: false
},
my_target : {
files : {
'production/app/app.min.js' : ['production/js/ngmin.js']
}
}
},
docular : {
groups: [],
showDocularDocs: false,
showAngularDocs: false
}
});
//Load plugins here
grunt.loadNpmTasks('grunt-ngmin');
grunt.loadNpmTasks('grunt-docular');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-jasmine');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-connect');
//Define your tasks here
grunt.registerTask('test', ['jasmine']);
grunt.registerTask('build', ['concat', 'ngmin', 'uglify']);
grunt.registerTask('default', ['test', 'build', 'watch']);

};

J'ai eu un problème similaire. Et résolu de la façon suivante. Nous avons besoin d'exécuter une Gorgée module appelé gulp-ng-annoter avant de courir uglify.
Nous avons donc installer ce module

npm install gulp-ng-annotate --save-dev

Alors ne le nécessitent Gulpfile.js

ngannotate = require(‘gulp-ng-annotate’)

Et dans votre usemin tâche de faire quelque chose comme ceci

js: [ngannotate(), uglify(),rev()] 

Qui a résolu pour moi.

[EDIT: correction de fautes]

C'est très difficile à déboguer parce que beaucoup de services sont nommés de la même façon (surtout e ou a). Cela ne résoudra pas l'erreur, mais vous fournir le nom de la contestation service qui vous permet de suivre, dans le uglified de sortie, l'emplacement dans le code et, enfin, vous avez la possibilité de résoudre le problème:

Aller dans lib/scope.jsde Uglify2 (node_modules/grunt-contrib-uglify/node_modules/uglify-js/lib/scope.js) et remplacez la ligne

this.mangled_name = this.scope.next_mangled(options);

avec

this.mangled_name = this.name + "__debugging_" + counter++