什么是Bower
Bower 是 twitter 推出的一款包管理工具，基于nodejs的模块化思想，把功能分散到各个模块中，让模块和模块之间存在联系，通过 Bower 来管理模块间的这种联系。Bower使用flat dependency tree
安装和使用
这里使用Ubuntu，安装Nodejs和包管理npm请使用apt-get。由于Ubuntu有个包叫node，所以直接运行bower会提示出错/usr/bin/env: node: 没有那个文件或目录。为了解决这个问题，需要做个软链。另外大部分的依赖包都是从git上面拉取下来的，这都快成为业界规范了，因此再装个git吧。
1
2
3
4
5
6
7
8
9
10
| sudo apt-get install nodejs
sudo apt-get install npm
sudo apt-get install git
sudo npm install -g bower
//解决node文件不存在的问题
sudo ln -s /usr/bin/nodejs /usr/bin/node
//解决bower没有权限的问题
sudo chown $USER:$USER ~/.config/configstore/bower-github.yml
//需要运行在非SUDO模式下，否则会有ESUDO错误。
bower install jquery
|
缓存目录位于~/.config/configstore/bower_components。可以通过find自行查找find ./ -name bower_components
1
2
3
4
5
6
7
8
| //列出所有当前路径下的包
bower list
//搜索
bower search bootstrap
//包信息检索
bower info bootstrap#3.0.0
//初始化创建bower.json
bower init
|
随后可以开始创建页面。如果当前目录没有出现bower_components这个文件夹，可以重新运行一次bower install package。
引用包的路径为bower_components/packagename/dist/filename
示例：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| <!doctype html>
<html>
<head>
<title>Learning Bower</title>
</head>
<body>
<button>Animate Me!!</button>
<div style=”background:red;height:100px;width:100px;position:absolute;”>
</div>
<script type=”text/javascript” src=”bower_components/jquery/dist/jquery.min.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){
$(“button”).click(function(){
$(“div”).animate({left:’250px’});
});
});
</script>
</body>
</html>
|
参考
http://bower.io/#getting-started
//这个html的引用路径出错
http://blog.fens.me/nodejs-bower-intro/
