强大的Web包管理工具-bower
前言
每当我们开始一个新的web前端项目,我们做个第一件事都是去下载相应的js类库文件。
如我们项目要用到Jquery,我们就要去Jquery的官网下载Jquery库。
接着若我们的前端UI要用到Bootstrap,我们还要去Bootstrap的官网下载Bootstrap,而最新的Bootstrap3需要Jquery1.9以上的支持,我们不得不又要检查Jquery的版本是否合适,不合适的话要重新下载。
甚至复杂一点的angular.js的项目我们可能要依赖angular的一些模块:angular-route、angular-animate等。
像angular-route.js这个路由模块在angular1.2之前是内置于angular的,而angular1.2之后是从angular分离出来的(上次升级angular被坑了2小时。。)。
我去,这些问题想想都头疼。这时候我们需要一个工具来管理这些库及其依赖。
bower介绍
bower是twitter推出的一款web软件包管理工具,使用nodejs开发,开源。
提供添加新web包,更新web包,删除web包,发布web包,管理包依赖等功能。
bower安装dd
bower的安装是通过node.js的npm管理工具来安装的 :
$ npm install -g bower
bower命令
安装完成后,我们可以通过bower –help来查看bower有什么命令
各命令说明:
- cache : bower缓存管理
- help : 显示Bower命令的帮助信息
- home : 通过浏览器打开一个包的github发布页
- info : 查看包的信息
- init : 创建bower.json文件
- install : 安装包到项目
- link : 在本地bower库建立一个项目链接
- list : 列出项目已安装的包
- lookup : 根据包名查询包的URL
- prune : 删除项目无关的包
- register : 注册一个包
- search : 搜索包
- update : 更新项目的包
- uninstall : 删除项目的包
bower使用
使用bower来安装包及依赖:
bower install – 根据bower.json配置文件来安装web包。
bower install
bower install
bower install
使用bower来安装bootstrap :
$ cd /www/test
$ bower install bootstrap
执行以上命令自动安装bootstrap框架及它所依赖的最新版的Jquery。
通过bower list –path 你可以得到每个类库的路径名称映射。
这样就能再项目中使用对应的类库了。
<script src="bower_components/jquery/jquery.js"></script>
其他命令的使用:
还有其他命令用法也基本大同小异:
如bower update jquery 更新jquery包。 bower uninstall jquery 删除jquery包。
这里就不多说了大家动手敲一遍就会了。