Bower是什麼東西?
一個前端包管理工具。能夠幫我們管理Web站點上的各種框架,類庫等等。主要作用有如下:能夠幫助我們跟蹤前端包,並且保證他們是最新(或者是你指定的特定版本),Bower能夠管理前端裏面的HTML,CSS,JS,甚至還可以是圖片。Bower還有一個最大的好處,它對我們前端進行了優化。如果多個包依賴於一個包,例如jQuery,那麼Bower將只下載jQuery一次,這樣就稱為扁平依賴,它有助於減少頁面加載。
簡言之就是用於搜索、安裝和卸載如JavaScript、HTML、CSS之類的網絡資源。
安裝
bower依賴於node.js和npm,如果要使用它需要先安裝node.js和npm,因為node.js包含npm,所以只需要安裝node.js即可。
1.Node安裝(若已安裝可跳過):
Windows 安裝包(.msi)
32 位安裝包下載地址 : https://nodejs.org/dist/v4.4....
64 位安裝包下載地址 : https://nodejs.org/dist/v4.4....
CentOS安裝:
獲取源碼,解壓,編譯安裝,配置變量修改權限,編譯文件,檢查版本
cd /usr/local/src/
wget http://nodejs.org/dist/v0.10.24/node-v0.10.24.tar.gz
tar zxvf node-v0.10.24.tar.gz
cd node-v0.10.24
./configure --prefix=/usr/local/node/0.10.24
make
make install
vim /etc/profile
設置nodejs環境變量,在 export PATH USER LOGNAME MAIL HOSTNAME HISTSIZE HISTCONTROL 一行的上面添加如下內容:
#set for nodejs
export NODE_HOME=/usr/local/node/0.10.24
export PATH=$NODE_HOME/bin:$PATH
//重編譯生效
source /etc/profile
//檢查是否安裝成功
node -v
2.Bower安裝:
npm install bower –g
初始化
bower init
安裝、更新、卸載依賴包
bower install
如:bower install jQuery#1.2
bower update
bower unstall
清理緩存
bower cache clean
查詢
bower search 包名
註冊包
先去github上面建立一個庫(項目)(公有,私有都行)或者其他,只要能讓bower.com能訪問到地址應該都可以。
比如建立了一個叫做angualr-demo的庫,然後加入bower init來管理這個庫。
bower install ngDemo 安裝
Bower配置文件(bower.json)
作用類似於composer.json,執行bower install時會依據這個配置文件更新庫
bower.json配置文件
{
"name":"", //必須,如果需要註冊包,則該包名唯一。
"description":"", //可選,包描述
"main":[], //可選,入口文件,bower本身不使用,供第三方構建工具會使用
//每種文件類型只能有一個。
"ignore":[], //可選,文件或目錄列表。bower安裝的時候將忽略該列表中的文件。
//bower是從git倉庫或壓縮包下載一個包,裏面的文件並不一定全部需要。
"dependencies":[], //依賴包,name:value,value可以是包的semver
//range(版本號範圍),也可以直接是一個包的git地址或壓縮包地址。
"devDependencies":[], //開發依賴包,僅僅在開發過程中測試或者編譯文檔用,部署生產環境是不需要。
//格式和dependencies 相同
"resolutions":[], //包引用衝突自動使用該模塊指定的包版本
//格式和dependencies 相同
"overrides" :[ //這個也很關鍵,可以覆蓋一個包中的默認設置,比如main裏面設定的入口文件
"package-name":{ //這樣可以根據需要,讓第三方工具只打包需要的文件。
"main":[]
}
],
"moduleType":"", //可選,指定包採用那種模塊化方式(globals,amd,node,es6,yui)
"private":Boolean, //是否公開發布當前包,如果只是使用bower來管理項目的包,設置為true.
"license":"", //授權方式(GPL-3.0,CC-BY-4.0.....)
"keywords":[], //可選,方便註冊後容易被其他人搜索到。
"authors":[], //作者列表
"homepage":[], //主頁,包介紹頁
"repository":{ //包所在倉庫。
"type": "git",
"url": "git://github.com/foo/bar.git"
},
}
.bowerrc
.bowerrc文件是用來配置bower本身的一些默認配置的
如,bower install 安裝,默認會安裝到當前目錄下,要修改該安裝位置,則需要編輯.bowerrc文件
新建.bowerrc文件
{
"directory":"public/bower_components"
}