標(biāo)簽（空格分隔）： npm和bower的區(qū)別 前端包管理器

序

前端富應(yīng)用時(shí)代纺蛆，寫代碼器仗，基本不會從底層自己開始造輪子了丹锹，盡管你想鍛造自己的技藝班套，但是丟過來的項(xiàng)目周期不允許你肆無忌憚的慢悠悠的潛心雕琢。所以我們怎么辦佳恬，前端開發(fā)助力軍為了互相解放捏境，為了千千萬萬的基層程序員也能過上正常下班的生活于游，有些自己貢獻(xiàn)的代碼庫毁葱，匯總到一個(gè)地方---叫“npm”；說白了贰剥，就是托管我們第三方的服務(wù)器倾剿，上面提供一系列的下載，版本管理的功能服務(wù)蚌成。

區(qū)別

npm的依賴管理是倒向樹結(jié)構(gòu)（不同于linux越底層依賴越星岸弧），層層遞歸担忧。一個(gè)普通的前端包的依賴樹非常冗長芹缔，甚至可能觸及windows下256字符的路徑長度限制。同時(shí)和其它安裝包不能共享依賴代碼瓶盛。導(dǎo)致文件非常多最欠，不適合前端代碼部署。而bower讓模塊開發(fā)者定義了簡潔的輸出文件惩猫。不過下一代 npm3 會從根本上改善這一問題芝硬，所有依賴包會水平處理共享。隨著CommonJS普及轧房，前后端今后統(tǒng)一使用npm是大勢所趨拌阴。

二者功能上是一樣的，
兩個(gè)都是包管理器奶镶，bower偏重于前端一些迟赃。例如在html文件中直接引入第三方的依賴，我們側(cè)重使用bower-components里的資源厂镇。

為什么用它們

1.節(jié)省時(shí)間纤壁。

沒用Bower之前，每次需要安裝jQuery的時(shí)候剪撬，都需要去jQuery網(wǎng)站下載包或使用CDN版本摄乒。但用了Bower，你只需要輸入一個(gè)命令，jquery就會安裝在本地計(jì)算機(jī)上馍佑，你不需要去記版本號之類的東西斋否，你也可以通過Bower的info命令去查看任意庫的信息。

2.脫機(jī)工作拭荤。

Bower會在用戶主目錄下創(chuàng)建一個(gè).bower的文件夾茵臭，這個(gè)文件夾會下載所有的資源、并安裝一個(gè)軟件包使它們可以離線使用舅世。如果你熟悉Java旦委，Bower即是一個(gè)類似于現(xiàn)在流行的Maven構(gòu)建系統(tǒng)的.m2倉庫。每次你下載任何資源庫都將被安裝在兩個(gè)文件夾中 —— 一個(gè)在的應(yīng)用程序文件夾雏亚，另一個(gè)在用戶主目錄下的.bower文件夾缨硝。因此，下一次你需要這個(gè)倉庫時(shí)罢低，就會用那個(gè)用戶主目錄下.bower中的版本查辩。

3.可以很容易地展現(xiàn)客戶端的依賴關(guān)系。

你可以創(chuàng)建一個(gè)名為bower.json的文件网持，在這個(gè)文件里你可以指定所有客戶端的依賴關(guān)系宜岛，任何時(shí)候你需要弄清楚你正在使用哪些庫，你可以參考這個(gè)文件功舀。

4.讓升級變得簡單萍倡。

假設(shè)某個(gè)庫的新版本發(fā)布了一個(gè)重要的安全修補(bǔ)程序，為了安裝新版本辟汰，你只需要運(yùn)行一個(gè)命令列敲，bower會自動更新所有有關(guān)新版本的依賴關(guān)系。

眾所周知莉擒，npm（Node Package Manager）是nodejs時(shí)代不可或缺的最好的包管理器酿炸，現(xiàn)在已經(jīng)隨nodejs官方包同時(shí)會安裝到你的設(shè)備上去。只要給項(xiàng)目書寫好package.json放于項(xiàng)目根目錄涨冀，在重新部署之時(shí)只需要執(zhí)行 npm install一行簡單的命令填硕，所有相關(guān)的依賴就能夠自動安裝到項(xiàng)目目錄下面，并且還能很方便的對不同項(xiàng)目的不同依賴包版本進(jìn)行良好鹿鳖、統(tǒng)一的管理扁眯。

Bower

NPM和Twitter推出的名為Bower 的包管理器之間到底有什么樣的關(guān)系和區(qū)別呢？（Bower的官網(wǎng)寫到翅帜，Bower 是 "A package manager for the web" 姻檀，難道說NPM就不是了嗎？）涝滴。

其實(shí)绣版，在實(shí)際項(xiàng)目中胶台，NPM和Bower都會被運(yùn)用進(jìn)去。并且Bower的安裝和升級全都依賴于NPM杂抽，使用如下命令就可以全局安裝Bower

npm install -g bower

之后你就可以使用

bower install [#]

類似于NPM的方式诈唬，對于當(dāng)前項(xiàng)目進(jìn)行前端依賴的相關(guān)管理。使用起來和NPM一樣方便快捷缩麸。

有人可能會問铸磅，為何不用NPM一個(gè)工具對前后端進(jìn)行統(tǒng)一的依賴管理呢？ 實(shí)際上杭朱，因?yàn)閚pm設(shè)計(jì)之初就采用了的是嵌套的依賴關(guān)系樹阅仔，這種方式顯然對前端不友好；而Bower則采用扁平的依賴關(guān)系管理方式弧械，使用上更符合前端開發(fā)的使用習(xí)慣八酒。

不過，現(xiàn)在越來越多出名的js依賴包可以跨前后端共同使用梦谜，所以Bower和NPM上面有不少可以通用的內(nèi)容丘跌。實(shí)際項(xiàng)目中，我們可以采用NPM作用于后端唁桩；Bower作用于前端的組合使用模式。讓前后端公用開發(fā)語言的同時(shí)耸棒，不同端的開發(fā)工程師能夠更好地利用手上的工具提升開發(fā)效率荒澡。

小結(jié)、

其中与殃，與NPM最大的區(qū)別在于单山，NPM主要運(yùn)用于Node.js項(xiàng)目的內(nèi)部依賴包管理，安裝的模塊位于項(xiàng)目根目錄下的node_modules文件夾內(nèi)幅疼。而Bower大部分情況下用于前端開發(fā)米奸，對于CSS/JS/模板等內(nèi)容進(jìn)行依賴管理，依賴的下載目錄結(jié)構(gòu)可以自定義爽篷。

ps:部分截取網(wǎng)絡(luò)資源的整理