Ich habe eine Datei client.js, die auf dem Client geladen wird. In dieser Datei befindet sich Code, der Funktionen aus anderen JavaScript-Dateien aufruft. Mein Versuch war zu verwenden
var m = require('./messages');
um den Inhalt zu laden messages.js (genau wie ich es auf der Serverseite mache) und später Funktionen aus dieser Datei aufrufen. Jedoch, require ist auf der Clientseite nicht definiert und löst einen Formularfehler aus Uncaught ReferenceError: require is not defined.
Auch diese anderen JavaScript-Dateien werden zur Laufzeit auf dem Client geladen, da ich die Links im Header der Webseite platziere. Der Client kennt also alle Funktionen, die aus diesen anderen Dateien exportiert werden.
Wie rufe ich diese Funktionen aus diesen anderen JavaScript-Dateien auf (z. B messages.js) im Wesentlichen client.js Datei, die den Socket zum Server öffnet?
Das ist weil require() ist im browser-/clientseitigen JavaScript nicht vorhanden.
Jetzt müssen Sie einige Entscheidungen bezüglich Ihrer clientseitigen JavaScript-Skriptverwaltung treffen.
Sie haben drei Möglichkeiten:
- Benutzen Sie die
<script> Schild.
- Benutze einen CommonJS Implementierung. Es verfügt über synchrone Abhängigkeiten wie Node.js
- Benutze ein asynchrone Moduldefinition (AMD) Implementierung.
CommonJS Zu den clientseitigen Implementierungen gehören (die meisten davon erfordern einen Build-Schritt vor der Bereitstellung):
- Browserify – Sie können die meisten Node.js-Module im Browser verwenden. Das ist mein persönlicher Favorit.
- Webpack – Macht alles (bündelt JavaScript-Code, CSS usw.). Es wurde durch den Aufschwung von React populär, ist aber für seine schwierige Lernkurve berüchtigt.
- Aufrollen – ein neuer Anwärter. Es nutzt ES6-Module und verfügt über Tree-Shaking-Funktionen (entfernt nicht verwendeten Code).
Sie können mehr über meinen Vergleich lesen Browserify vs. (veraltete) Komponente.
AMD Zu den Implementierungen gehören:
- RequireJS – Sehr beliebt bei clientseitigen JavaScript-Entwicklern. Aufgrund seiner asynchronen Natur ist es nicht mein Geschmack.
Beachten Sie, dass Sie bei Ihrer Suche nach dem passenden Modell darüber lesen werden Laube. Bower befasst sich nur mit Paketabhängigkeiten und hat keine Meinung zu Moduldefinitionen wie CommonJS und AMD.
Warum gehst du nicht einfach
<script src="messages.js"></script>und sie danach anrufen?– Sterling Archer
27. September 2013 um 20:34
Vielleicht kann dies eine Lösung sein, aber es gibt noch eine andere Sache, die mich beunruhigt. Ich habe auch eine Datei namens „representation.js“ zum Abstrahieren der Darstellung, die dem Client und dem Server gemeinsam ist. In dieser Datei habe ich auch require-Anweisungen und auf der Serverseite sollte es in Ordnung sein, da ich Node ausführe. Auf der Clientseite wird dies jedoch ein Problem darstellen. Was denken Sie?
– MightyMouse
27. September 2013 um 20:45 Uhr
Für Neulinge wie mich (die vor einer Woche noch nicht einmal „npm“ buchstabieren konnten! 🙂 kann es hilfreich sein, die Funktionsweise von Browserify zu verstehen
--requireOption verursachtrequire()muss auf der Client-Seite definiert werden. Sehen: lincolnloop.com/blog/speedy-browserifying-multiple-bundles– Hephaistos
12. März 2016 um 18:34
@Sterling Archer … Wenn es 100 solcher Dateien gibt … können wir sie nicht weiter laden, in HTML, richtig …
– Baradwaj Aryasomayajula
9. Juni 2016 um 18:58
„Client auf node.js“ ist ein verwirrender Titel, da sich „Client“ normalerweise auf den Webbrowser-Client bezieht, während node.js eine serverseitige Umgebung ist. Können wir klären, ob es sich um einen Browser oder einen Node handelt?
– ggorlen – zum LLM-Streik
21. September 2022 um 15:17 Uhr