bower安装和使用

字数745 阅读10127 评论2 喜欢3

bower的安装

1,首先在我的系统 安装 nodejs。因为我的系统是windows,还需要安装msysgit,注意图二中的选项

msysgit

Git setup

2,之后就可以用npm包管理工具下载并全局安装bower:

>npm install -g bower

全局安装bower 后,可以查看Bower的帮助信息,使用命令:

>bower help

3, 初始化当前工程的bower,此操作会在当前目录下生成bower.json文件:

>bower init


bower的使用

使用了bower的项目都会在目录下有一个bower.json文件。在该文件同级目录下,使用如下命令即可安装相关依赖库。

>bower install

注:bower下载安装依赖库实际上是使用git进行下载。对于linux系统,由于默认都有安装git,所以一般没问题。但是windows系统一般没有git。在windows系统下需要确定安装了git客户端,建议使用同捆的git bash命令行来执行bower install命令。或者把git目录加入windows的环境变量中,再在命令行中执行bower install命令。()


使用bower安装某个特定类库,例如jquery:

> bower install jquery


使用bower更新某个特定类库,例如jquery:

>bower update jquery


删除包,例如jquery (如果包已经被依赖,则不能删除)

>bower uninstall jquery


试着在项目文件夹下,下载jquery 和 underscore

bower install jquery underscore

然后就可以看到项目文件夹下多了bower_components(默认目录),再就是两个插件包了

bower_components

初步这样也就行了,但是/bower_components这个目录有点让人不习惯,我想把东西下载到我习惯的目录里。需要加一个.bowerrc文件。注意,不需要名字什么的,只要新增一个.bowerrc就行了。

提示:用cmd命令创建文件如下

cmd创建文件

.bowerrrc

里面可以定义下载目录:

{

"directory": "app/vendor"

}

.bowerrc 配置

关于.bowerrc更多配置,请参考
https://github.com/bower/spec/blob/master/config.md

同样的cmd命令再执行一遍,这次可以看到文件下载到app/vendor中了。

下载到指定目录

由于在实际安装过程中,没有运行命令 >bower init 现在重新运行该命令 生成bower.json

遇到了问题

bower init 失败

解决办法:在 windows cmd 里面使用 bower init,而不是在 git bash 里面使用 bower init.

init 设置

使用bower install jquery --save才会把jquery依赖记入到bower.json。
要安装某个版本使用#,如安装juqery1.9.1,可以使用bower install jquery#1.9.1。
除了用包名安装,也可以指定git地址,进行安装,如bower install https://github.com/jquery/jquery。


bower install --save handlebars 后就会看到handlebar 在bower.json的dependencies里,如果不加--save就不会有。

handlebars

接下来删了app/vendor下的所有内容,然后bower install,他会把bower.json中的dependencies重新下载。

[入门]bower安装和使用的更多相关文章

  1. bower安装使用入门详情

    bower安装使用入门详情   bower自定义安装:安装bower需要先安装node,npm,git全局安装bower,命令:npm install -g bower进入项目目录下,新建文件1.tx ...

  2. Yeoman入门之安装及环境配置

    Yeoman入门之安装及环境配置 http://blog.csdn.net/panlingfan/article/details/27345037 http://www.nodejs.orgYEOMA ...

  3. Less入门与安装(转)

    快速入门 Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量.混合(mixin).函数等功能,让 CSS 更易维护.方便制作主题.扩充. Less 可以运行在 Node.浏览 ...

  4. Bower安装Bootstrap

    1.Bower简介 官网:https://bower.io/ Bower can manage components that contain HTML, CSS, JavaScript, fonts ...

  5. ES 入门之一 安装ElasticSearcha

    安装ElasticSearcha 学习ES也有快一个月了,但是学习的时候一直没有总结.以前没有总结是因为感觉不会的很多,现在对ES有一点了解了.索性就从头从安装到使用ES做一个详细的总结,也分享给其他 ...

  6. Maven的安装、配置及使用入门+maven安装报错:JAVA_HOME【申明:来源于网络】

    Maven的安装.配置及使用入门+maven安装报错:JAVA_HOME[申明:来源于网络] Maven的安装.配置及使用入门:http://www.cnblogs.com/dcba1112/arch ...

  7. Redis入门 -- Redis安装与配置

    Redis入门 -- Redis安装与配置 Redis的安装 Redis的安装,我这里使用的是虚拟机. 为了让主机和虚拟机之间可以顺利通信,按照以下步骤进行: 1. 将网络连接模式改为桥接 2. re ...

  8. bower安装和使用

    bower的安装 1,首先在我的系统 安装 nodejs.因为我的系统是windows,还需要安装msysgit,注意图二中的选项   msysgit   Git setup 2,之后就可以用npm包 ...

  9. FastAdmin 如何用 composer bower 安装

    FastAdmin 如何安装 composer bower 众所周知的原因,compower bower 安装并不怎么稳定. 刚开始安装时还有侥幸,用软件安装里的设置端口代理,composer 倒是可 ...

随机推荐

  1. Unity NGUI 2D场景添加按钮

    比如说先添加一个sprite 在sprite加上NGUI的 UI Button 然后重点来了  加上Box Collider 2D(重点:2D 千万不要加 Box Collider) 将Box Col ...

  2. Android 之 Activity的生命周期

  3. 贪心算法 hdu 1009

    1.因为要排序只派j[i]/f[i],不能知道f[i]和j[i]各自排序后的顺序,因此要用到结构体 2.用sort(ware,ware+n,cmp) cmp 为俩个数组的元素比较大小的布尔值 #inc ...

  4. android WebView总结

    http://blog.csdn.net/chenshijun0101/article/details/7045394 http://blog.csdn.net/ethan_xue/article/d ...

  5. 最大流 总结&&做题记录

    最近一直很忙,为了节省时间,从今以后的题解会 一个专题 写一篇. 刷了一些题后,有了以下总结: 模型要点: 1.构造流量平衡,在满足流量平衡的情况下,找到要让什么最大. 2.一般用于判断性问题,即所有 ...

  6. android属性之excludeFromRecents -- clearTaskOnLaunch 隐身意图 启动activity

    这个可以  用android 任务中app 隐藏起来 android属性之clearTaskOnLaunch 此属性是 每次启动app时都会进入 根目录中      android:clearTask ...

  7. Pig与Hive的区别

    Language 在Hive中可以执行  插入/删除 等操作,但是Pig中我没有发现有可以 插入 数据的方法,请允许我暂且认为这是最大的不同点吧. Schemas Hive中至少还有一个“表”的概念, ...

  8. 如何利用Cloudera Manager来手动安装parcel包

    1.问题的描述: 当你利用Cloudera Manager部署了CDH的集群后,也许随着你的业务需求,你需要对你的就去哪做一些优化,或者扩展之类的,这个时候你可能需要下载安装一些组件.例如,我最近在阅 ...

  9. DOM优化

    一:DOM与浏览器: 重排:改变页面的内容. 重绘:浏览器显示的内容. 添加顺序:尽量在appendchild之前. 合并DOM操作-利用csstext, 缓存布局信息 文档碎片. 二 DOM 与事件 ...

  10. Libgdx 开发指南(1) 应用框架

    应用框架 模块 Libgdx包含五个核心接口与操作系统交互,各自实现了如下接口: Application:运行应用,向client通知应用层事件,例如窗口大小的改变(window resizing). ...