Anforderungen: Fetch Event Source ist ein von Microsoft implementiertes SSE-Streaming, erstellt mit NPM-Paketen, kann nicht direkt im Browser verwendet werden und erfordert, dass das NPM-Paket in ein im Browser ausgeführtes JavaScript-Skript kompiliert wird.
NPM ist ein Node-Paketverwaltungstool, das auf dem Node-API-Standard basiert, während JavaScript eine Skriptsprache ist, die im Browser auf dem ECMAScript-Standard basiert. Aufgrund der unterschiedlichen Standards können NPM-Pakete nicht direkt im Browser ausgeführt werden.
Häufig verwendete Verpackungswerkzeuge:
- Webpack: Webpack ist eines der beliebtesten Frontend-Packaging-Tools, es kann JavaScript, Stylesheets, Bilder und andere Ressourcen verarbeiten und unterstützt modulare Entwicklung.
- Parcel: Parcel ist ein Verpackungstool ohne Konfiguration, das Abhängigkeiten automatisch verarbeitet und Projekte verpackt, was es ideal für den schnellen Bau von Projekten macht.
- Rollup: Rollup konzentriert sich auf das Paketieren von JavaScript-Bibliotheken, die mehrere Module in einer einzigen Datei packen können, und unterstützt die Baumschüttel-Optimierung.
- Browserify: Browserify ermöglicht es Ihnen, das Modulsystem von Node.js in Ihrem Browser zu verwenden, das CommonJS-Module in browser-erkennbaren Code packen kann.
- Grunt: Grunt ist ein Aufgabenautomatisierungstool, das zum Paketen, Kompprimieren, Zusammenführen und anderen Operationen wie Code-Paketierung verwendet werden kann.
- Gulp: Ähnlich wie Grunt ist Gulp ein Aufgabenautomatisierungstool, verwendet jedoch Code über Konfiguration, um Aufgabendefinitionen prägnanter und klarer zu machen.
- Brunch: Brunch ist ein schnelles und einfaches Frontend-Paketierungstool, das JavaScript, CSS, HTML und andere Dateien verarbeiten kann und Plugin-Erweiterungen unterstützt.
Dieser Artikel benötigt zwei Werkzeuge:browserify、verkleinern(Kompressor für JS-, CSS-, HTML- und IMG-Dateien)
Zuerst erstellen Sie einen neuen Ordner und initialisieren Sie schnell ein Node-Projekt mit folgendem Befehl:
revidierenpackage.jsonDas Dokument lautet wie folgt:
Install browserify, minify, fetch-event-source, der Befehl lautet wie folgt:
Führe den Kompilierungsbefehl wie folgt aus:
Wobei: -r den npm-Paketnamen angibt, der kompiliert werden soll, -s Der im Code verwendete Modulname (benutzerdefinierter Name entsprechend deinen eigenen Gewohnheiten)
Nach Abschluss der Ausführung ist die event.min.js die komprimierte Datei, wie in der untenstehenden Abbildung dargestellt:
Kopieren Sie den event.min.js-Inhalt zum Testen in die Browser-Konsole, wie im untenstehenden Bild gezeigt:
(Ende)
|