Differenza tra bower, browserify, requirejs, webpack?

Question

Sono abituato a progetti JS semplici e piccoli in cui le dipendenze JS sono concatenate e ridotte come parte del processo di generazione utilizzando qualcosa come gulp e il tag script nel html contiene il percorso hardcoded a quel file JS minificato. Non è elegante e probabilmente ha diversi svantaggi, ma concettualmente è un approccio semplice.

Ma con progetti più grandi, capisco che è bene guardare a sistemi di packaging come bower, browserify, requirejs, webpack, ecc. Qual è il vantaggio di usarli al contrario di come sono abituato a farlo? Quali sono i principali modi in cui aiuta il processo di sviluppo?

Sono queste tecnologie che ho menzionato concorrenti l'un l'altro, o alcune di esse soddisfano scopi diversi e possono essere utilizzate insieme? Qual'è la differenza tra loro?

Inoltre, ho esaminato il webpack ed è descritto in alcuni punti come se fosse un rimpiazzo per il gulp. Pensavo che Gulp fosse un sistema di costruzione e diverso da questi strumenti di packaging?

MODIFICA: in che modo questi concetti si riferiscono a AMD o CommonJS?

Answer 1

Browserify, RequireJS, WebPack sono tutti i caricatori di moduli. Sia AMD che CommonJ sono tipi di moduli. Molte (la maggior parte) librerie javascript come JQuery possono essere caricate come moduli. Require è in giro da un po 'e il suo IP è sotto la fondazione DOJO. Browerify sta guadagnando popolarità soprattutto a causa del lato server JS (nodo) che funziona anche lato client.

Client side javascript module loaders su slant.co.

Bower è un gestore di pacchetti utilizzati soprattutto per installare repo Git e può anche collegare in GULP o Grunt, che sono strumenti di compilazione front end cioè che usano l'ottimizzatore requireJS a minify, ecc

È possibile confrontare i tre caricatori di moduli, Bower non è paragonabile come una volta che i suoi pacchetti copiati per te sono più o meno così.