什么是bower
Bower —— A package manager for the web
bower是前端包管理工具。我個人認(rèn)為就是管理前端所依賴的庫的管理工具。當(dāng)一個項目用到多種庫時,管理會出現(xiàn)有些麻煩。
包的概念
當(dāng)安裝多個包時,會將這些資源的配置文件寫在bower.json中。
安裝bower
首先確定你的系統(tǒng)安裝了nodejs.之后就可以用npm(n是專門管理node模塊的管理工具,而bower是node的模塊)包管理工具下載并
//全局安裝bower:
npm install -g bower
//全局安裝Bower后,可以查看Bower的幫助信息,使用命令:
bower help
bower的使用
注:bower下載安裝依賴庫實際上是使用git進行下載。對于linux系統(tǒng),由于默認(rèn)都有安裝git,所以一般沒問題。但是windows系統(tǒng)一般沒有g(shù)it。在windows系統(tǒng)下需要確定安裝了git客戶端,建議使用同捆的git bash命令行來執(zhí)行bower install命令。或者把git目錄加入windows的環(huán)境變量中,再在命令行中執(zhí)行bower install命令。
使用bower安裝某個特定類庫,例如jquery:
bower install jquery
執(zhí)行完每一條命令后,bower都會自動下載對應(yīng)庫文件bower_commponts/目錄
bower install jquery-ui#1.10.1
上面的命令指定安裝jquery-ui的1.10.1版。
如果某個庫依賴另一個庫,安裝時默認(rèn)將所依賴的庫一起安裝。比如,jquery-ui依賴jquery,安裝時會連jquery一起安裝。
安裝后的庫默認(rèn)存放在項目的bower_components子目錄,如果要指定其他位置,可在.bowerrc文件的directory屬性設(shè)置。
{ "directory" : "public/components"}
bower install jquery --save
然后bower就會從遠(yuǎn)程下載jquery最新版本到你的js/lib目錄下其中--save參數(shù)是保存配置到你的bower.json.
Bower 可使用如下幾種方式下載文件
#已經(jīng)注冊的包,使用簡單即可
bower install jquery
#GitHub上的項目,使用名稱即可
bower install desandro/masonry
#GitHub上的項目
bower install git://github.com/......
#直接通過URL下載
bower install (網(wǎng)址)
使用bower更新某個特定類庫,例如jquery:
bower update jquery
刪除包,例如jquery (如果包已經(jīng)被依賴,則不能刪除)
bower uninstall jquery
更多的命令請用help查看。
bower help
維護依賴
使用
bower install package --save
能夠?qū)惭b到你的項目中,同時將依賴關(guān)系寫入到bower.json
的 dependencies數(shù)組。
同理,使用
bower install package --save-dev
可以將包寫入到 bower.json 的 devDependencies數(shù)組。
bower初始化
bower init
會提示你輸入一些基本信息,根據(jù)提示按回車或者空格即可,然后會生成一個bower.json文件,用來保存該項目的配置,如下:
(未完成)
bower.json 的規(guī)范中的選項,主要包括:
name
包名,必選。
version
有意義的版本號。
main
字符串或者數(shù)組,指定主要會用到包里面哪些文件。
ignore
數(shù)組,一系列文件名或者目錄,告訴bower在安裝包的時候忽略指定的內(nèi)容。
keywords
字符串?dāng)?shù)組,推薦添加,主要是幫助用戶能夠搜索到你的包。
dependencies
哈希結(jié)構(gòu),依賴的包,可以指定版本號,版本號范圍參考。
devDependencies
哈希結(jié)構(gòu),生產(chǎn)環(huán)境下依賴的包,版本號范圍參考。
private
布爾值,設(shè)置為true代表你想保持私有,并且將來不會發(fā)布它。
包的信息
比如我們想要查找jquery都有哪些個版本,輸入如下命令:
bower info jquery
會看到j(luò)query的bower.json的信息,和可用的版本信息可以看到j(luò)query最新的兼容版版本為1.11.3
包的更新
上面安裝的是最新版的高版本jquery,假如想要兼容低版本瀏覽器的呢?已經(jīng)查到兼容低版本瀏覽器的jquery版本為1.11.3,下面直接修改bower.json文件中的jquery版本號如下:
"dependencies": { "jquery": "~1.11.3" }
然后執(zhí)行如下命令:
bower update
bower
就會為你切換jquery的版本了
包的查找
還有一個很重要的功能,就是包的查找,比如我想要安bootstrap的某個插件,但是記不住名字了,就可以直接在命令行輸入:
bower search bootstrap
bower就會列出包含字符串bootstrap的可用包了
包的卸載
卸載包可以使用uninstall 命令:
bower uninstall jquery
bower install bootstrap
bower會自動從github上down最新的代碼,而且,會自動將依賴包jquery也下載進來。
指定版本:
bower install jquery#1.7.2
bower install bootstrap#3.3.5 --save
多版本共存:
同時安裝一個package的不同版本(多版本共存), 比如安裝jquery v1.7.0,并且安裝v1.9.1以及最新版本的jquery(目前是2.1.1), 像下面這樣安裝完成后,你的bower_components目錄下就會同時存在jquery-older目錄(1.7.0), jquery-old目錄(1.9.1), jquery目錄(最新版)。
安裝jquery v1.7.0bower install jquery-older=juqery#1.7.0 [<options>]
安裝jquery v1.9.0bower install jquery-old=juqery#1.9.1 [<options>]
安裝最新版jquerybower install jquery [<options>]
bower常用命令
cache:bower緩存管理
help:顯示Bower命令的幫助信息
home:通過瀏覽器打開一個包的github發(fā)布頁
info:查看包的信息
init:創(chuàng)建bower.json文件
install:安裝包到項目
link:在本地bower庫建立一個項目鏈接
list:列出項目已經(jīng)安裝的包
lookup:根據(jù)包名查詢包的URL
prune:刪除項目無關(guān)的包
register:注冊一個包
search:搜索項目的包
update:更新項目的包
uninstall:刪除項目的包