標簽（空格分隔）： npm和bower的區別 前端包管理器

序

前端富應用時代，寫代碼，基本不會從底層自己開始造輪子了，盡管你想鍛造自己的技藝，但是丟過來的項目周期不允許你肆無忌憚的慢悠悠的潛心雕琢。所以我們怎么辦，前端開發助力軍為了互相解放，為了千千萬萬的基層程序員也能過上正常下班的生活，有些自己貢獻的代碼庫，匯總到一個地方---叫“npm”；說白了，就是托管我們第三方的服務器，上面提供一系列的下載，版本管理的功能服務。

區別

npm的依賴管理是倒向樹結構（不同于linux越底層依賴越小），層層遞歸。一個普通的前端包的依賴樹非常冗長，甚至可能觸及windows下256字符的路徑長度限制。同時和其它安裝包不能共享依賴代碼。導致文件非常多，不適合前端代碼部署。而bower讓模塊開發者定義了簡潔的輸出文件。不過下一代 npm3 會從根本上改善這一問題，所有依賴包會水平處理共享。隨著CommonJS普及，前后端今后統一使用npm是大勢所趨。

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

為什么用它們

1.節省時間。

沒用Bower之前，每次需要安裝jQuery的時候，都需要去jQuery網站下載包或使用CDN版本。但用了Bower，你只需要輸入一個命令，jquery就會安裝在本地計算機上，你不需要去記版本號之類的東西，你也可以通過Bower的info命令去查看任意庫的信息。

2.脫機工作。

Bower會在用戶主目錄下創建一個.bower的文件夾，這個文件夾會下載所有的資源、并安裝一個軟件包使它們可以離線使用。如果你熟悉Java，Bower即是一個類似于現在流行的Maven構建系統的.m2倉庫。每次你下載任何資源庫都將被安裝在兩個文件夾中 —— 一個在的應用程序文件夾，另一個在用戶主目錄下的.bower文件夾。因此，下一次你需要這個倉庫時，就會用那個用戶主目錄下.bower中的版本。

3.可以很容易地展現客戶端的依賴關系。

你可以創建一個名為bower.json的文件，在這個文件里你可以指定所有客戶端的依賴關系，任何時候你需要弄清楚你正在使用哪些庫，你可以參考這個文件。

4.讓升級變得簡單。

假設某個庫的新版本發布了一個重要的安全修補程序，為了安裝新版本，你只需要運行一個命令，bower會自動更新所有有關新版本的依賴關系。

眾所周知，npm（Node Package Manager）是nodejs時代不可或缺的最好的包管理器，現在已經隨nodejs官方包同時會安裝到你的設備上去。只要給項目書寫好package.json放于項目根目錄，在重新部署之時只需要執行 npm install一行簡單的命令，所有相關的依賴就能夠自動安裝到項目目錄下面，并且還能很方便的對不同項目的不同依賴包版本進行良好、統一的管理。

Bower

NPM和Twitter推出的名為Bower 的包管理器之間到底有什么樣的關系和區別呢？（Bower的官網寫到，Bower 是 "A package manager for the web" ，難道說NPM就不是了嗎？）。

其實，在實際項目中，NPM和Bower都會被運用進去。并且Bower的安裝和升級全都依賴于NPM，使用如下命令就可以全局安裝Bower

npm install -g bower

之后你就可以使用

bower install [#]

類似于NPM的方式，對于當前項目進行前端依賴的相關管理。使用起來和NPM一樣方便快捷。

有人可能會問，為何不用NPM一個工具對前后端進行統一的依賴管理呢？ 實際上，因為npm設計之初就采用了的是嵌套的依賴關系樹，這種方式顯然對前端不友好；而Bower則采用扁平的依賴關系管理方式，使用上更符合前端開發的使用習慣。

不過，現在越來越多出名的js依賴包可以跨前后端共同使用，所以Bower和NPM上面有不少可以通用的內容。實際項目中，我們可以采用NPM作用于后端；Bower作用于前端的組合使用模式。讓前后端公用開發語言的同時，不同端的開發工程師能夠更好地利用手上的工具提升開發效率。

小結、

其中，與NPM最大的區別在于，NPM主要運用于Node.js項目的內部依賴包管理，安裝的模塊位于項目根目錄下的node_modules文件夾內。而Bower大部分情況下用于前端開發，對于CSS/JS/模板等內容進行依賴管理，依賴的下載目錄結構可以自定義。

ps:部分截取網絡資源的整理