it-swarm.com.de

Nicht übereinstimmendes anonymes define () -Modul

Ich erhalte diese Fehlermeldung, wenn ich zum ersten Mal in meiner Web-App surfe (normalerweise in einem Browser mit deaktiviertem Cache).

Fehler: Nicht übereinstimmendes anonymes define () -Modul: function (require) {

[~ # ~] html [~ # ~] :

<html>
   .
   .
   .
   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
   <script> var require = { urlArgs: "v=0.4.1.32" }; </script>
   <script data-main="assets/js/main" src="assets/js/libs/require.js"></script>
   <script src="assets/js/ace/ace.js?v=0.4.1.32"></script>
   </body>
</html>

[~ # ~] js [~ # ~] :

$(function () {
    define(function (require) {
        // do something
    });
});

Weiß jemand genau, was dieser Fehler bedeutet und warum er auftritt?

Quelldatei , eine kurze Diskussion darüber auf der Seite mit den Github-Problemen

113

Wie AlienWebguy sagte, laut Dokumentation require.js kann explodieren if

  • Sie haben ein anonymes define (" -Modul, das define () ohne String-ID " aufruft, in einem eigenen Skript-Tag (ich nehme an, sie bedeuten irgendwo in globaler Geltungsbereich)
  • Sie haben Module mit widersprüchlichen Namen
  • Sie verwenden Loader-Plugins oder anonyme Module, verwenden jedoch nicht den Optimierer von require.js, um sie zu bündeln

Ich hatte dieses Problem, als ich Bundles, die mit browserify erstellt wurden, zusammen mit den require.js-Modulen einbaute. Die Lösung war entweder:

A. Laden Sie die eigenständigen Bundles non-require.js in Skript-Tags , bevor require.js geladen wird, oder

B. Laden Sie sie mit require.js (anstelle eines Skript-Tags)

133
B T

Ich hatte diesen Fehler, weil ich die requirejs-Datei zusammen mit anderen Bibliotheken direkt in ein Skript-Tag aufgenommen habe. Diese Bibliotheken (wie lodash) verwendeten eine Definitionsfunktion, die im Widerspruch zur Definition von require stand. Die requirejs-Datei wurde asynchron geladen, daher vermute ich, dass die require-Definition nach der Definition der anderen Bibliotheken definiert wurde, daher der Konflikt.

Um den Fehler zu beheben, schließen Sie alle anderen js-Dateien mit requirejs ein.

13
eloone

Beim Einstieg in die Arbeit mit reactjs bin ich auf das Thema gestoßen und als Anfänger kann das docs auch auf Griechisch geschrieben sein.

Das Problem, auf das ich gestoßen bin, war, dass die meisten Beispiele für Anfänger "anonyme Definitionen" verwenden, wenn Sie eine "Zeichenfolgen-ID" verwenden sollten.

anonym definiert

define(function() {
        return { helloWorld: function() { console.log('hello world!') } };
 })


define(function() {
        return { helloWorld2: function() { console.log('hello world again!') } };
 })

definieren mit String-ID

define('moduleOne',function() {
    return { helloWorld: function() { console.log('hello world!') } };
})

 define('moduleTwo', function() {
      return { helloWorld2: function() { console.log('hello world again!') } };
})

Wenn Sie define mit einer String-ID verwenden, vermeiden Sie diesen Fehler, wenn Sie versuchen, die Module wie folgt zu verwenden:

require([ "moduleOne", "moduleTwo" ], function(moduleOne, moduleTwo) {
    moduleOne.helloWorld();
    moduleTwo.helloWorld2();
});
10
P.Brian.Mackey

Nach dem docs :

Wenn Sie ein Skript-Tag manuell in HTML codieren, um ein Skript mit einem anonymen Aufruf von define () zu laden, kann dieser Fehler auftreten.

Wird auch angezeigt, wenn Sie ein Skript-Tag manuell in HTML codieren, um ein Skript zu laden, das einige benannte Module enthält, dann aber versuchen, ein anonymes Modul zu laden, das denselben Namen wie eines der benannten Module im Skript hat, das vom manuell geladen wird codiertes Skript-Tag.

Wenn Sie die Loader-Plugins oder anonymen Module (Module, die define () ohne Zeichenfolgen-ID aufrufen) verwenden, aber nicht das RequireJS-Optimierungsprogramm zum Kombinieren von Dateien verwenden, kann dieser Fehler auftreten. Das Optimierungsprogramm kann anonyme Module korrekt benennen, sodass sie mit anderen Modulen in einer optimierten Datei kombiniert werden können.

Um den Fehler zu vermeiden:

  • Stellen Sie sicher, dass Sie alle Skripten, die define () aufrufen, über die RequireJS-API laden. Codieren Sie Skript-Tags nicht manuell in HTML, um Skripts zu laden, in denen define () -Aufrufe enthalten sind.

  • Wenn Sie ein HTML-Skript-Tag manuell codieren, stellen Sie sicher, dass es nur benannte Module enthält und dass kein anonymes Modul geladen wird, das denselben Namen wie eines der Module in dieser Datei hat.

  • Wenn das Problem in der Verwendung von Loader-Plugins oder anonymen Modulen besteht, der RequireJS-Optimierer jedoch nicht für die Dateibündelung verwendet wird, verwenden Sie den RequireJS-Optimierer.

10
AlienWebguy

Beachten Sie, dass einige Browsererweiterungen den Seiten Code hinzufügen können. In meinem Fall hatte ich ein "Emmet in all textareas" -Plugin, das meine Anforderungen nicht erfüllte. Stellen Sie sicher, dass Ihrem Dokument kein zusätzlicher Code hinzugefügt wurde, indem Sie ihn im Browser überprüfen.

5
Vector

Die vorhandenen Antworten erklären das Problem gut, aber wenn es aufgrund von altem Code nicht einfach ist, Ihre Skriptdateien mit oder vor requireJS einzuschließen, müssen Sie require vor Ihrem Skript-Tag aus dem Fenster entfernen und es anschließend wieder einbauen. In unserem Projekt wird dies hinter einem serverseitigen Funktionsaufruf eingeschlossen, aber der Browser sieht effektiv Folgendes:

    <script>
        window.__define = window.define;
        window.__require = window.require;
        window.define = undefined;
        window.require = undefined;
    </script>
    <script src="your-script-file.js"></script>        
    <script>
        window.define = window.__define;
        window.require = window.__require;
        window.__define = undefined;
        window.__require = undefined;
    </script>

Nicht die sauberste, scheint aber zu funktionieren und hat viel Refraktärarbeit gespart.

4
jcbdrn

Oder Sie können diesen Ansatz verwenden.

  • Fügen Sie require.js in Ihre Codebasis ein
  • laden Sie dann Ihr Skript über diesen Code

<script data-main="js/app.js" src="js/require.js"></script>

Was es tun wird, wird Ihr Skript nach dem Laden von require.js laden.

1
Umar Asghar