Share
Hai mai clonato o scaricato un repository GitHub, solo per trovare un numero di file strani ed estranei che non riconosci?
Diciamo, ad esempio, che stai lavorando su un sito web e hai bisogno di una libreria, JavaScript o CSS, per aggiungere alcune funzionalità al tuo progetto. Troverai la libreria perfetta in un repository GitHub, quindi scaricala subito. Quando estrai il pacchetto, scopri diversi file strani, uno dei quali è bower.json.
Inoltre, potresti aver trovato istruzioni nel repository che generalmente dicono qualcosa sulla falsariga di:
Installa con Bower:
bower installa bootstrap.
Potresti chiederti a cosa serve questo file, per non parlare del perché dovresti installarlo con Bower. Recentemente mi sono state poste queste domande da un mio amico del web designer e ho il sospetto che ci siano molte persone che si sentono allo stesso modo confuse. Se sei una di queste persone, questo suggerimento rapido dovrebbe aiutarti!
Bower è un gestore di pacchetti per il web. Ti aiuta a gestire le dipendenze; file (forse di terze parti, spesso disponibili pubblicamente tramite GitHub) di cui hai bisogno per il tuo progetto.
bower.json, il file di cui stiamo parlando qui gioca un ruolo centrale in un ambiente Bower. Precedentemente, è stato chiamato component.json, ma il nome è stato quindi modificato in bower.json per evitare conflitti che potrebbero verificarsi con gli altri strumenti che utilizzano lo stesso nome file.
bower.json aiuta Bower a comprendere il progetto; registra metadati come il nome del progetto, la versione, l'autore, la licenza, le dipendenze e così via. Le informazioni sono strutturate in JSON, che in genere si presenta come segue:
"name": "awesome", "version": "1.0.0", "authors": ["John Doe"], "description": "The Most Awesome in the Galaxy", "license": "MIT "," dipendenze ": " cool-library ":" 1.1.2 "," buona libreria ":" 2.1.3 "
Da questo file JSON leggibile dall'uomo possiamo dedurre che questo progetto si chiama "awesome", è attualmente alla versione "1.0.0", è stato creato da "John Doe", un paio di altri dettagli, e richiede un paio di dipendenze per essere presente per poter lavorare.
Se trovi bower.json in una libreria, implica due cose:
Bower utilizza questo file in diversi modi. Usa i meta dettagli per visualizzare le informazioni sul pacchetto quando cerchiamo nel registro di Bower.
Troverai alcuni progetti familiari nel registro di BowerBower analizzerà anche il file quando eseguiremo diversi comandi come versione bower e installazione di bower.
installazione di bower è il comando per installare un pacchetto che è registrato nel registro di Bower. Questo comando installerà anche i pacchetti elencati in bower.json sotto "dipendenze". Per impostazione predefinita, questi pacchetti verranno aggiunti in una cartella denominata bower_components.
Ad esempio, installiamo Animate.css e Bootstrap con Bower.
Per cominciare, dovrai effettivamente installare Bower. Date un'occhiata a Meet Bower: un gestore di pacchetti per il web per i dettagli su questo. Fatto ciò, puoi digitare il seguente comando nel Terminale o nel Prompt dei comandi (se stai usando Windows) che installa questi pacchetti simultaneamente:
bower installa animate.css bootstrap
Ora dovresti trovarli aggiunti nei bower_components.
Cartella Animate.css e Bootstrap aggiunte in bower_componentsCome puoi vedere sopra, abbiamo una cartella aggiuntiva, jquery. Questo perché Bootstrap lo imposta come dipendenza; i componenti JavaScript Bootstrap richiedono il funzionamento di jQuery. Se dai un'occhiata al file bower.json incluso nel pacchetto, lo troverai elencato alla fine del file, come segue.
jQuery è impostato come dipendenza in bower.json di BootstrapSupponendo che tu abbia appena scaricato una libreria con un file bower.json di accompagnamento, la prima cosa che ti suggerisco è di ispezionare il file per le dipendenze.
Ad esempio, ho scaricato una libreria JavaScript chiamata Revealer.js. Sembra che Revealer.js richieda Reveal.js per funzionare. Possiamo trovarlo elencato come dipendenza all'interno del file bower.json, come mostrato di seguito:
// ... "dipendenze": "reveal.js": "~ 2.5.0", // ...
Giusto per confermarlo, se apriamo index.html da visualizzazioni cartella, troveremo reveal.js il file è collegato all'interno di a copione tag, così.
Ora dobbiamo aprire la cartella della libreria nel Terminale o nel prompt dei comandi, quindi digitare:
installazione di bower
Come accennato in precedenza, questo comando scaricherà tutti i pacchetti registrati in bower.json contemporaneamente.
Nota: In questo caso particolare, il pacchetto viene aggiunto nel / componenti pubbliche cartella, come specificato in .bowerrc file. Un file .bowerrc a volte accompagna il file bower.json e viene utilizzato per specificare le directory di installazione personalizzate.
Il pacchetto che abbiamo installato può essere aggiornato nel tempo, sia per correggere i bug sia per aggiungere nuove funzionalità. Con Bower, l'aggiornamento di queste librerie è un gioco da ragazzi. Prima di tutto, digita:
lista dei bower
Questo elencherà i pacchetti attualmente installati nel nostro progetto e ci mostrerà l'ultima versione disponibile. Nel nostro caso, sembra che Reveal.js abbia una versione più recente. Quindi, aggiorniamolo.
La versione più recente di Reveal.js è disponibileDigita questo comando per aggiornare Reveal.js.
bower install --save reveal.js # 2.6.2
Questo cambierà anche la versione registrata nel bower.json del nostro progetto.
// ... "dipendenze": "reveal.js": "2.6.2", // ...
Bower è uno strumento davvero utile per gestire le librerie di progetti. È un po 'come avere il nostro AppStore o Google Play; possiamo installare, aggiornare e rimuovere facilmente le librerie. Spero che questo suggerimento abbia contribuito a evitare qualsiasi confusione che potresti incontrare durante il download di librerie di terze parti e ti ha mostrato i vantaggi dell'utilizzo di Bower nel tuo flusso di lavoro.
Accentsconagua