前端開發bower包管理器

Bower 是 twitter 推出的一款包管理工具，基於nodejs的模塊化思想，他能夠很好的幫助你幫你解決js的依賴管理，好比jquery angular bootstrap 等等。

能夠很方便的對這些包進行下載升級刪除等等。

下面與你們分享下本身簡單學到的知識。

如下都是基於windows用戶。

一、安裝node

　bower插件是經過npm, Node.js包管理器安裝和管理的

　因此要先安裝nodejs，新版nodey已經集成安裝npm了，因此咱們能夠直接使用npm   node-v0.10.29-x64.msi 提取碼：kj9b

二、 安裝 msysgit

　 點我下載

　具體安裝就不講了 網上有不少。

二、安裝bower

　 在cmd 下 全局安裝bower

npm install -g bower

三、在項目目錄運行

npm install --save-dev bower

四、生成bower.json 配置文件

若是你的項目有不少依賴，你總不想每次都一個個的從新安裝吧？ 這樣咱們就須要用到 bower.json配置文件了，全部依賴都會記錄在裏面，這樣生成,如圖一步步完成

bower init

五、安裝依賴包

這時咱們已經能夠安裝依賴包了，咱們先安裝個jquery和bootstrap

bower install --save-dev jquery bootstrap

這時你會忽然發現出錯了，[ENOGIT git is not installed or not in the PATH]

彆着急這是由於前面安裝的msysgit 沒有寫到環境變量裏，咱們這樣解決：

假如你的git安裝目錄是"C:\Program Files (x86)\Git"，在path中加入git的bin和cmd目錄，如C:\Program Files (x86)\Git\bin;C:\Camnpr\Program Files (x86)\Git\cmd

若是這個方法不起做用是由於，你修改的path沒有生效， 你須要從新啓動電腦，有一個方法不須要重啓電腦就立馬生效，很好用，看下面

在cmd中輸入下面代碼 並回車 而後關閉cmd窗口。

path PATH=xxxx

 

在你的項目文件夾從新打開cmd窗口，繼續運行安裝依賴包的代碼

這時你會發現 哇塞 下載下來了！路徑是什麼？你會發現下載到一個叫bower_components的文件夾去了，這個有點。。好尷尬啊~

能不能改路徑呢？能！這樣作

在項目根下建立一個名爲.bowerrc 的文件，內容爲（目錄爲項目根目錄 ./lib/）

{
  "directory" : "lib"
}

你確定懷疑我是怎麼創建的無名文件。。 - _ -

在項目根目錄的cmd中輸入並回車。去看文件夾 文件出來了，別謝我，我叫紅領巾！

type null > .bowerrc

咱們繼續。。。。

把前面下載的手動刪掉，再從新

bower install

此次爲何後面沒有跟着 jquery啊？ 由於前面已經寫入bower.json了呀！知道配置文件的好處了吧？

到此位置安裝完成哦。

六、使用

我想能來看這篇文章的同窗都應該知道一個js文件如何引用了吧？

但是目錄結構。。。看圖（看不懂別打我啊 我躲。。）

你應該會問 這目錄這麼多文件，真正上線的時候咋辦？

其實這個問題嘛！這個和gulp就又掛上勾了，要在gulp裏對其進行選擇性編譯哇。哇卡卡。

 

好啦 就到這裏啦~ 有問題隨時溝通交流  你們一塊兒進步