什么是bower

Bower是一个客户端技术的软件包管理器,它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。其他一些建立在Bower基础之上的开发工具,如YeoMan和Grunt,这个会在以后的文章中介绍。

准备工作

  1. 安装node环境:node.js
  2. 安装Git,bower从远程git仓库获取代码包:git简易指南

安装bower

使用npm,打开终端,输入:

npm install -g bower

其中-g命令表示全局安装

开始使用

使用help命令查看帮助

自定义包的安装目录

首先进入项目目录下,新建文件1.txt

然后命令行进入项目目录下,输入命令重命名该文件为.bowerrc

rename 1.txt .bowerrc

这个.bowerrc文件是自定义bower下载的代码包的目录,比如现在我的项目结构如下图:

那我的.bowerrc文件内容如下:

{
"directory" : "js/lib"
}

bower初始化

命令行进入项目目录中,输入命令如下:

bower init

会提示你输入一些基本信息,根据提示按回车或者空格即可,然后会生成一个bower.json文件,用来保存该项目的配置,如下:

{
"name": "bb_boot",
"version": "0.0.1",
"authors": [
"savokiss <jaynaruto@qq.com>"
],
"moduleType": [
"amd"
],
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"js/lib",
"test",
"tests"
],
"dependencies": {
}
}

包的安装

下面终于开始安装需要的包了!
比如我要安装一个jquery,输入如下命令:

bower install jquery --save

然后bower就会从远程下载jquery最新版本到你的js/lib目录下
其中--save参数是保存配置到你的bower.json,你会发现bower.json文件已经多了一行:

  "dependencies": {
"jquery": "~2.1.4"
}

包的信息

比如我们想要查找jquery都有哪些个版本,输入如下命令:

bower info jquery

会看到jquerybower.json的信息,和可用的版本信息

可以看到jquery最新的兼容版版本为1.11.3

包的更新

上面安装的是最新版的高版本jquery,假如想要兼容低版本浏览器的呢?
已经查到兼容低版本浏览器的jquery版本为1.11.3,下面直接修改bower.json文件中的jquery版本号如下:

  "dependencies": {
"jquery": "~1.11.3"
}

然后执行如下命令:

bower update

bower就会为你切换jquery的版本了

包的查找

还有一个很重要的功能,就是包的查找,比如我想要安装bootstrap的某个插件,但是记不住名字了,就可以直接在命令行输入:

bower search bootstrap

bower就会列出包含字符串bootstrap的可用包了

包的卸载

卸载包可以使用uninstall 命令:

bower uninstall jquery

 

如何安装并使用bower包依赖工具的更多相关文章

  1. 在npm中使用bower包依赖工具

    什么是bower Bower是一个客户端技术的软件包管理器,它可用于搜索.安装和卸载如JavaScript.HTML.CSS之类的网络资源.其他一些建立在Bower基础之上的开发工具,如YeoMan和 ...

  2. python3.4学习笔记(八) Python第三方库安装与使用,包管理工具解惑

    python3.4学习笔记(八) Python第三方库安装与使用,包管理工具解惑 许多人在安装Python第三方库的时候, 经常会为一个问题困扰:到底应该下载什么格式的文件?当我们点开下载页时, 一般 ...

  3. 前端工程化系列[01]-Bower包管理工具的使用

    本文主要介绍前端开发中常用的包管理工具Bower,具体包括Bower的基本情况.安装.使用和常见命令等内容,最后还介绍了依赖树管理的常见方式以及Bower采用的策略并进行了比较. 1.1 关于Bowe ...

  4. bower包管理工具

    安装: npm install bower -g (全局安装) 验证: bower --version 指令( 以vue为例 ): 1.  bower info vue              查看 ...

  5. Ubuntu14.04安装build-essential失败,包依赖问题如何解决?

    正在读取软件包列表... 完成 正在分析软件包的依赖关系树        正在读取状态信息... 完成        有一些软件包无法被安装.如果您用的是 unstable 发行版,这也许是 因为系统 ...

  6. python入门:python包管理工具pip的安装

    pip 是一个安装和管理 Python 包的工具 , 是 easy_install 的一个替换品. distribute是setuptools的取代(Setuptools包后期不再维护了),pip是e ...

  7. windows XP下Python2.7包管理工具安装-setuptool,pip、distribute、nose、virtualenv

    在Python开发中为了对项目进行管理和调试.必须安装一些特定的软件包.据说业内这个叫做yak shaving-做一个非常酷非常绚丽的Python项目之前,必须做的一些枯燥无味的准备工作.本文介绍了s ...

  8. 包管理工具Carthage使用

    iOS项目中第三方开源库的工具有Cocoapods和Carthage,swift官方出了一个包管理工具SPM(Swift Package Manager). 首先,大体讲一下Cocoapods和Car ...

  9. Golang学习--包管理工具glide

    上一篇文章中我们已经成功的运行了go的代码,这是我们迈出的最基础的一步. 一个项目通常会依赖很多外部的库,当依赖的库比较多的时候,手工管理就会比较麻烦,这个时候就需要包管理工具出场了,帮你管理好所有依 ...

随机推荐

  1. JSP中获取jstl中的数据

    我们在编程JSP时,有时会须要訪问jstl中的数据,或者说是el表达式中的数据. 比方, <c:forEach    varStatus="data1" var=" ...

  2. POJ 1579-Function Run Fun(内存搜索)

    Function Run Fun Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 16503   Accepted: 8514 ...

  3. jquery-制作选项卡

    强大的jquery-制作选项卡   最近在学习jquery,特地把今天写的一个选项卡源码贴出来.只是做只是梳理,大神们请不要吐槽,如果有更好的方法,欢迎指点.谢谢. css <style> ...

  4. 关于easyui的tab,layout,datagrid嵌套的问题

    我的项目使用easyui作为前台的展示框架现在页面中是一个layout布局(分上,左,中)在左边是一些菜单,点击后,在中间部分增加一个tab显示内容而增加的tab里面是显示一些列表数据,列表上面是查询 ...

  5. Hibernate进化史-------Hibernate概要

    一个.Hibernate概要 什么是Hibernate呢?首先,Hibernate是数据持久层的一个轻量级框架.实现了ORMapping原理(Object Relational Mapping). 在 ...

  6. Dev环境中的集成测试用例执行时上下文环境检查(实战)

    Dev环境中的集成测试用例执行时上下文环境检查(实战) Microsoft.NET 解决方案,项目开发必知必会. 从这篇文章开始我将分享一系列我认为在实际工作中很有必要的一些.NET项目开发的核心技术 ...

  7. Remoting接口测试工具

    动手写一个Remoting接口测试工具 基于.NET开发分布式系统,经常用到Remoting技术.在测试驱动开发流行的今天,如果针对分布式系统中的每个Remoting接口的每个方法都要写详细的测试脚本 ...

  8. Azure的两种关系型数据库服务:SQL Azure与SQL Server VM的不同

    Azure的两种关系型数据库服务:SQL Azure与SQL Server VM的不同 <Windows Azure Platform 系列文章目录> 如果熟悉Windows Azure平 ...

  9. sprinfmvc学习--01

    springmvc框架是一个基于请求驱动的web框架,使用了前端控制器模式来设计.根据请求映射规则分发给相应的页面控制器进行处理. 1.  首先用户发送请求-->DispatcherServle ...

  10. html页面显示服务器时间

    全局变量 var lblTimer; var d; ready事件里面写 lblTimer = $("#lbltimer"); d = new Date('<%=DateTi ...