Requisiti: Fetch Event Source è uno streaming SSE implementato da Microsoft, costruito utilizzando pacchetti NPM, non può essere utilizzato direttamente sul browser e richiede che il pacchetto NPM venga compilato in uno script JavaScript eseguito dal browser.
NPM è uno strumento di gestione dei pacchetti Node, implementato sulla base dello standard Node API, mentre JavaScript è un linguaggio di scripting che gira nel browser, basato sullo standard ECMAScript. A causa dei diversi standard, i pacchetti NPM non possono essere eseguiti direttamente sul browser.
Strumenti di imballaggio comunemente utilizzati:
- Webpack: Webpack è uno degli strumenti di packaging front-end più popolari disponibili, può gestire JavaScript, fogli di stile, immagini e altre risorse, e supporta lo sviluppo modulare.
- Parcel: Parcel è uno strumento di packaging a configurazione zero che gestisce automaticamente le dipendenze e impacchettisce i progetti, rendendolo ideale per costruire progetti rapidamente.
- Rollup: Rollup si concentra sull'impacchettare librerie JavaScript, che possono impacchettare più moduli in un unico file e supporta l'ottimizzazione Tree Shaking.
- Browserify: Browserify ti permette di utilizzare il sistema di moduli di Node.js nel tuo browser, che può impacchettare moduli CommonJS in codice riconoscibile dal browser.
- Grunt: Grunt è uno strumento di automazione delle attività che può essere utilizzato per impacchettare, comprimere, unire e altre operazioni come il package del codice.
- Gulp: Simile a Grunt, Gulp è uno strumento di automazione delle attività, ma usa il codice invece della configurazione per rendere le definizioni dei compiti più concise e chiare.
- Brunch: Brunch è uno strumento di packaging front-end veloce e semplice che può gestire JavaScript, CSS, HTML e altri file, e supporta estensioni per plugin.
Questo articolo richiede due strumenti:browserify、minify(Compressore per file JS, CSS, HTML e IMG)
Per prima cosa, crea una nuova cartella e inizializza rapidamente un progetto Node con il seguente comando:
revisionarepackage.jsonIl documento recita come segue:
Installa browserify, minify, fetch-event-source, il comando è il seguente:
Esegui il comando di compilation come segue:
Dove: -r specifica il nome del pacchetto npm da compilare -s Il nome del modulo usato nel codice (nome personalizzato secondo le tue abitudini)
Dopo il completamento dell'esecuzione, il event.min.js è il file compresso, come mostrato nella figura sottostante:
Copia il contenuto event.min.js nella console del browser per il test, come mostrato nell'immagine qui sotto:
(Fine)
|