text: Node.js | SquadWuschel's Blog
  Archiv der Kategorie: Node.js
  AngularJS minification mit npm (node.js) und ng-annotate
  Wenn ich aktuell AngularJS Module erstelle, dann achte ich bereits darauf das der Code minify fähig ist. Denn durch die Verwendung von Dependency Injection (DI) von AngularJS muss beim Schreiben von AngularJS Modulen bereits darauf geachtet werden das der Code minify fähig ist.
  Daher wird aus dem Folgenden nicht minify fähigen Code:
  angular.module("AngularStrapModalCtrl", [])
  .controller("AngularStrapModalCtrl", function ($modal, $scope, modalCtrl) {
  $scope.modal = {
  testModalCtrl: modalCtrl
  .controller("modalCtrl", function ($scope) {
  this.name = "testname";
  $scope.test = "blubb";
  Der minify fähige Code:
  .controller("AngularStrapModalCtrl", ["$modal", "$scope", "modalCtrl", function ($modal, $scope, modalCtrl) {
  .controller("modalCtrl", ["$scope", function ($scope) {
  Denn die Funktionsparameter die normalerweise über DI aufgelöst werden, werden in einem String Array definiert und damit weiß AngularJS auch nach dem minifien weiterhin das für einen Parameter z.B. mit dem Namen "a" als "$scope" aufgelöst werden soll. Hierbei ist es wichtig das die Reihenfolge der Werte im String Array der Parameter im Funktionsaufruf entspricht.
  Wenn man aber auf Module von anderen Entwicklern zurückgreift, dann sind diese Module nicht immer minify fähig und müssten für diesen Zweck von uns von Hand angepasst werden. Hier kann uns der Node Package Manager npm weiterhelfen, der direkt mit node.js installiert wird und eine eigene Konsole zur verfügung stellt. Eine gute Einführung in npm stellt die Seite selbst zur Verfügung.
  Denn für npm gibt es das Packet "ng-annotate" welches die oben genannte minify Funktion bereits vollautomatisch für uns ausführt. Installiert wird "ng-annotate" über die npm Konsole welche direkt mit node.js installiert wird.
  Den Befehl auf der npm Konsole ausführen, um "ng-annotate" zu installieren.
  Beim Installieren von npm Paketen kann es zu einem Timeout kommen, vor allem wenn man hinter einem Proxyserver sitzt. Mir hat dabei der folgende Eintrag weitergeholfen:
  Wenn "ng-annotate" erfolgreich installiert wurde, dann kann man über einen einfachen Befehl auf der npm Konsole unser Angular Modul minify fähig machen.
  C:\>ng-annotate –add "c:\Temp\nichtMinifyFaehig.js" -o "c:\Temp\minifyFaehig.js"
  Die Ausgabedatei enthält dann den kompletten AngularJS Modulcode inkl. der Parameterarrays für die minification.
  Das ganze lässt sich natürlich entsprechend ausbauen, das dies immer ausgeführt wird wenn das Projekt erstellt wird, … hier sind dem Entwickler wie immer keine Grenzen gesetzt.
  Dieser Eintrag wurde veröffentlicht in AngularJS, DotNetGerman Bloggers, JavaScript, Node.js und getaggt mit AngularJS, ng-annotate, node package manager, npm am 28. Dezember 2014 von SquadWuschel.