Angular "Status bereits definiert" Fehler nach dem Ausführen von concat / uglify

8

Ich entwickle eine AngularJS-Anwendung. Um den Code in der Produktion zu versenden, verwende ich diese Grunt-Konfiguration / Aufgabe:

%Vor%

Es ist wirklich schwer zu debuggen, und es ist eine Art Frage an Leute, die schon solche Probleme hatten und in eine Richtung zeigen können.

Mein Hauptmodul enthält diese Submodule:

%Vor%

Der Fehler, den ich bekomme, ist folgender:

%Vor%
  

Wenn ich das websites Modul entferne, bekomme ich den gleichen Fehler für   controlcenter.users.

Ich verwende ui-router , um das Routing in der App zu verwalten.

Nach meinem Build-Prozess (für Integrationstests) funktioniert alles gut:

%Vor%

Vielleicht machen ngAnnotate oder oder concat / uglify hier seltsame Dinge?

UPDATE 1: Es hat etwas mit meiner Konfiguration der Module zu tun. Hier ist der Code:

%Vor%
  1. Wenn ich den Namen des Status in websites_2 ändere, erhalte ich einen Fehler mit 'websites_2 ist bereits definiert'.
  2. Wenn ich das Modul vollständig entferne, hat das nächste das gleiche Problem in der Konfigurationsdatei. Also ist die Struktur falsch?

Update 2 :

  

Das Problem scheint concat verwandt.

Es nimmt jede JS-Datei und fügt sie nacheinander zu einer größeren Datei hinzu. Alle meine Module sind am Ende. Das letzte Modul hat immer das Problem mit 'Zustand bereits definiert'. Es ist also nicht nur die Reihenfolge der Module aneinander, es ist etwas elses ...

Update 3: Ich habe meinen Code (ich habe jeden Controller-Code und Funktionen, nur das Gerüst) in einem Gist platziert. Dies ist das Ergebnis nach meinem Kompilierungsprozess, ohne es zu verkomplizieren.

    
Bastian Gruber 17.06.2015, 10:08
quelle

3 Antworten

17

Problem:

Sie haben mehrere Dateien, die eine config Funktion enthalten, um Ihr Modul wie folgt zu konfigurieren:

%Vor%

Das Problem ist, dass Sie nach der Verkettung aller Dateien eine große Datei mit mehreren Deklarationen von config erhalten. Aufgrund des variablen Hubs von JavaScript werden alle Deklarationen nach oben verschoben, und nur die allerletzten Deklarationen werden ausgewertet. Dies ist:

%Vor%

Jedes Mal, wenn Sie .config(config) einem Modul zuweisen, geben Sie Angular an, das Modul mit dieser speziellen Konfigurationsfunktion zu konfigurieren, was bedeutet, dass es mehrfach ausgeführt wird und versucht, den Status websites mehr als einmal zu definieren.

Lösung:

Umschließen Sie jeden JavaScript-Dateicode mit einem Abschluss. Auf diese Weise vermeiden Sie, eine Variable / Funktion mehr als einmal zu deklarieren:

%Vor%

Bearbeiten :

  • Ich empfehle dringend, Ihre Dateien in Schließungen zu verpacken. Wenn Sie dies jedoch immer noch nicht tun möchten, können Sie Ihre Funktionen entsprechend ihren jeweiligen Modulen benennen. Auf diese Weise wird Ihre Konfigurationsfunktion für controlcenter.website.details controlcenterWebsiteDetailsConfig . Eine andere Option besteht darin, den Code während der Erstellungsphase mit grunt-wrap zu verpacken.

  • window.angular und closures: Dies ist eine Technik, die ich gerne für meinen Code verwende, wenn ich ihn hogifiziere. Indem Sie Ihren Code in eine Closure einfügen und ihm einen Parameter namens angular mit dem tatsächlichen Wert von window.angular zuweisen, erstellen Sie tatsächlich eine Variable, die egglifiziert werden kann. Dieser Code zum Beispiel:

    %Vor%

    Könnte leicht dazu egglifiziert werden (beachten Sie, dass jeder Verweis auf angular durch a ersetzt wird):

    %Vor%

    Auf der anderen Seite ist ein Code-Code wie folgt entpackt:

    %Vor%

    würde werden:

    %Vor%

    Weitere Informationen zu Schließungen finden Sie in diesem Beitrag und dieser Beitrag .

Danilo Valente 22.06.2015, 00:26
quelle
0

Wenn Sie es in der verketteten Datei überprüfen, haben Sie die Zustände zweimal definiert? Kann es sein, dass Sie die Dateien zweimal kopieren? Überprüfen Sie die temporären Ordner, von denen Sie die Dateien nehmen (auch in grunt config, was Sie kopieren und was Sie löschen ...).

    
eesdil 24.06.2015 13:33
quelle
0

Also hatte ich das gleiche Problem aber mit dem folgenden Setup:

  • yeoman angular-fullstack (mit Typoskript)
  • Websturm

Bei der angular-fullstack-Konfiguration waren die Schließungen bereits implementiert (wie Danilo Valente es vorschlägt), so dass ich ziemlich viel zu kämpfen hatte, bis ich herausfand, dass ich in Webstorm den Typoskript-Compiler aktiviert hatte, der alle meine * .ts-Dateien kompilierte zu * .js. Aber da Webstorm so "intelligent" ist, werden diese kompilierten Dateien nicht im Arbeitsbaum angezeigt. Grunt jedoch verkettet natürlich alle Dateien unabhängig davon, ob es sich um Typoskript von JS handelt. Deshalb wurden am Ende alle meine Staaten zweimal definiert.

Also der offensichtliche Fix: Deaktivierte Typoskript-Compiler von webstorm und löschte alle generierten * .js-Dateien und es funktioniert.

    
Brueni92 03.04.2016 10:56
quelle

Tags und Links