Questo articolo è un articolo speculare di traduzione automatica, clicca qui per saltare all'articolo originale.

Vista: 2278|Risposta: 0

Compila il pacchetto NPM in uno script JavaScript pronto per browser

[Copiato link]
Pubblicato su 25/04/2024 20:28:21 | | | |
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:browserifyminify(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)





Precedente:CentOS 7 installa il servizio di cache Redis 7.2.4
Prossimo:Tipi di font TrueType e OpenType differenza
Disconoscimento:
Tutto il software, i materiali di programmazione o gli articoli pubblicati dalla Code Farmer Network sono destinati esclusivamente all'apprendimento e alla ricerca; I contenuti sopra elencati non devono essere utilizzati per scopi commerciali o illegali, altrimenti gli utenti dovranno sostenere tutte le conseguenze. Le informazioni su questo sito provengono da Internet, e le controversie sul copyright non hanno nulla a che fare con questo sito. Devi eliminare completamente i contenuti sopra elencati dal tuo computer entro 24 ore dal download. Se ti piace il programma, ti preghiamo di supportare software autentico, acquistare la registrazione e ottenere servizi autentici migliori. In caso di violazione, vi preghiamo di contattarci via email.

Mail To:help@itsvse.com