Vereisten: Fetch Event Source is een SSE-streaming geïmplementeerd door Microsoft, gebouwd met NPM-pakketten, kan niet direct in de browser worden gebruikt en vereist dat het NPM-pakket wordt gecompileerd in een door de browser uitgevoerde JavaScript-script.
NPM is een Node-pakketbeheertool die is geïmplementeerd op basis van de Node API-standaard, terwijl JavaScript een scripttaal is die in de browser draait, gebaseerd op de ECMAScript-standaard. Vanwege de verschillende standaarden kunnen NPM-pakketten niet direct in de browser worden uitgevoerd.
Veelgebruikte verpakkingsgereedschappen:
- Webpack: Webpack is een van de populairste front-end verpakkingstools die beschikbaar zijn, het kan JavaScript, stylesheets, afbeeldingen en andere bronnen verwerken en ondersteunt modulaire ontwikkeling.
- Parcel: Parcel is een nul-configuratie verpakkingstool die automatisch afhankelijkheden afhandelt en projecten verpakt, waardoor het ideaal is voor het snel bouwen van projecten.
- Rollup: Rollup richt zich op het verpakken van JavaScript-bibliotheken, die meerdere modules in één bestand kunnen verpakken, en ondersteunt optimalisatie van boomschudden.
- Browserify: Browserify stelt je in staat om het modulesysteem van Node.js in je browser te gebruiken, waarmee je CommonJS-modules kunt verpakken in browserherkenbare code.
- Grunt: Grunt is een taakautomatiseringstool die kan worden gebruikt om te verpakken, comprimeren, mergen en andere bewerkingen zoals codeverpakking.
- Gulp: Net als Grunt is Gulp een taakautomatiseringstool, maar het gebruikt code over configuratie om taakdefinities beknopter en duidelijker te maken.
- Brunch: Brunch is een snelle en eenvoudige front-end verpakkingstool die JavaScript, CSS, HTML en andere bestanden kan verwerken, en plugin-extensies ondersteunt.
Dit artikel vereist twee hulpmiddelen:browserify、Kleineren(Compressor voor JS-, CSS-, HTML- en IMG-bestanden)
Maak eerst een nieuwe map aan en initialiseer snel een Node-project met het volgende commando:
herzienpackage.jsonHet document luidt als volgt:
Installeer browserify, minify, fetch-event-source, het commando is als volgt:
Voer het compilatiecommando uit als volgt:
Waarbij: -r specificeert de npm-pakketnaam die gecompileerd moet worden -s De modulenaam die in de code wordt gebruikt (aangepaste naam volgens je eigen gebruik)
Nadat de uitvoering is voltooid, is de event.min.js het gecomprimeerde bestand, zoals weergegeven in de onderstaande figuur:
Kopieer de event.min.js inhoud naar de browserconsole voor test, zoals te zien is op de onderstaande afbeelding:
(Einde)
|