写这篇博文就当是做个笔记吧,如果对其他人有帮助,那就再好不过了。
首先说明下,本次实验只是在ubuntu12.04环境中成功。
首先bower的产生是因为目前越来越复杂的javascript的依赖,需要用一些工具来进行js类库的依赖管理。
类似于maven之于java。
好了言归正传
#sudo apt-get install node 本来ubuntu可以安装node,但是事实上,会有问题:
axconfig: port 1 not active
axconfig: port 2 not active
解决方法是采用源代码安装
node-v0.10.29.tar.gz
#tar zxvf node-v0.10.29.tar.gz
#cd node-v0.10.29/
#./configure && make all
编译安装完成后,npm就可以使用了。
#sudo npm install -g bower //全局安装bower
现在就可以使用bower了(对了,你需要安装git,不过对于linux用户来说,git用的很多。就不用强调了)
#bower install jquery //现在都需要jquery吧
然后就开始使用了。
bower会在当前目录生成一个bower_components/的文件夹
结构如下:
其中bower.json类似与maven的pom.xml文件,当前类库的描述和依赖都由它来定义,以twitter的bootstrap框架为例。
{
"name": "bootstrap",
"description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
"version": "3.2.0",
"keywords": [
"css",
"js",
"less",
"mobile-first",
"responsive",
"front-end",
"framework",
"web"
],
"homepage": "http://getbootstrap.com",
"main": [
"less/bootstrap.less",
"dist/css/bootstrap.css",
"dist/js/bootstrap.js",
"dist/fonts/glyphicons-halflings-regular.eot",
"dist/fonts/glyphicons-halflings-regular.svg",
"dist/fonts/glyphicons-halflings-regular.ttf",
"dist/fonts/glyphicons-halflings-regular.woff"
],
"ignore": [
".*",
"_config.yml",
"CNAME",
"composer.json",
"CONTRIBUTING.md",
"docs",
"js/tests",
"test-infra"
],
"dependencies": {
"jquery": ">= 1.9.0"
}
}
哎呀,内容太多了。。其实我只关心
main
dependencies
另外如果你自己建立js框架的话,可以用bower init来生成一个自己的bower.json文件,非常方便啊,自从用过maven以后,就赖的不想写ant
的build.xml了。我实在是太懒了。
bower info xxxx可以list出来xxxx的所有版本,到这里的时候,我觉得github的伟大是用语言无法描述的。
bower search xxxx, 可以参考apt-cache search 和yum search 之内的用法。
bower info/install xxxx#2.1.1,可以指定到某个具体的版本,这才是这篇文章的重点吧,瞬间类库不再凌乱了吧。
最后提一下less这个东西,个人感觉懒人用起来还是不错的,精简的语法,客户端和服务端可以和css兼容,实在不行
git clone https://github.com/less/less.js
cd less/bin && lessc xxx.less
将less转为css就OK了。
bower在自动化部署前端的应用中应该有不错的效果。不过国内经常因为wall的原因,有时会不十分流畅,推荐可以使用代理来处理这个问题,有空再写一份goagent的使用说明。