Unkomprimierte jQuery-Datei: Ссылка jQuery Quelltext: Ссылка
Was tun sie, damit es so aussieht, als ob die endgültige Ausgabe Require.js nicht unter der Haube benutzt? Die Beispiele von Require.js weisen Sie an, die gesamte Bibliothek in Ihren Code einzufügen, damit sie eigenständig als einzelne Datei arbeitet.
Almond.js, eine kleinere Version von Require.js, sagt Ihnen auch, dass Sie sich in Ihren Code einfügen müssen, um eine eigenständige Javascript-Datei zu haben.
Wenn ich verkleinert werde, ist mir keine extra Bloat wichtig, es sind nur ein paar extra Kilobytes (für mandel.js), aber unminified ist kaum lesbar. Ich muss den ganzen Weg nach unten scrollen, vorbei an dem Code von mandel.js, um meine Anwendungslogik zu sehen.
Wie kann ich meinen Code ähnlich wie jQuery machen, in dem die endgültige Ausgabe nicht wie eine Frankenweenie aussieht?
Sie müssen Ihre eigene benutzerdefinierte Build-Prozedur erstellen.
Die jQuery-Erstellungsprozedur funktioniert nur, weil jQuery seine Module nach einem Muster definiert, das eine convert -Funktion die Quelle in eine verteilte Datei umwandeln lässt, die define nicht verwendet. Wenn jemand replizieren will, was jQuery macht, gibt es keine Abkürzung: 1) Die Module müssen nach einem Muster entworfen werden, das das Entfernen der define -Aufrufe ermöglicht, und 2) Sie müssen eine benutzerdefinierte Konvertierungsfunktion haben. Das macht jQuery. Die gesamte Logik, die die jQuery-Module in einer Datei kombiniert, befindet sich in build / tasks / build.js .
Diese Datei definiert eine benutzerdefinierte Konfiguration, die an r.js übergeben wird. Die wichtige Option sind:
out , das auf "dist/jquery.js" festgelegt ist. Das ist die Single
Datei, die durch die Optimierung erzeugt wurde.
wrap.startFile , das auf "src/intro.js" festgelegt ist. Diese Datei
wird dist/jquery.js vorangestellt.
wrap.endFile , das auf "src/outro.js" festgelegt ist. Diese Datei wird
an dist/jquery.js angehängt werden.
onBuildWrite , das auf convert festgelegt ist. Dies ist eine benutzerdefinierte Funktion .
Die Konvertierungsfunktion wird jedes Mal aufgerufen, wenn r.js ein Modul in die endgültige Ausgabedatei ausgeben möchte. Die Ausgabe dieser Funktion ist, was r.js in die endgültige Datei schreibt. Es macht folgendes:
Wenn ein Modul aus dem var/ -Verzeichnis stammt, wird das Modul sein
wie folgt transformiert. Nehmen wir den Fall von
src / var / toString.js :
Es wird:
%Vor% Andernfalls wird der Aufruf define(...) durch den Inhalt des an define übergebenen Callbacks ersetzt, die letzte return -Anweisung wird entfernt und alle Zuordnungen zu exports werden entfernt.
Ich habe Details weggelassen, die nicht speziell zu Ihrer Frage gehören.
Sie können ein Tool mit dem Namen AMDClean von gfranko Ссылка verwenden Es ist viel einfacher als das, was jQuery macht, und Sie können es schnell einrichten.
Alles, was Sie tun müssen, ist ein sehr abstraktes Modul zu erstellen (dasjenige, das Sie dem globalen Geltungsbereich zugänglich machen wollen) und alle Ihre Untermodule darin einzuschließen.
Eine andere Alternative, die ich kürzlich verwendet habe, ist browserifizieren . Sie können Ihre Module auf NodeJS-Art exportieren / importieren und in jedem Browser verwenden. Sie müssen sie vor der Verwendung kompilieren. Es hat auch Schluck und grunt Plugins zum Einrichten eines Workflows. Für bessere Erklärungen lesen Sie die Dokumentation auf browserify.org .