bower简明入门教程
什么是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": "myWeb",
"authors": [
"adou <doufu_0329@163.com>"
],
"description": "",
"main": "",
"license": "MIT",
"homepage": "",
"private": true,
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"wwwroot/lib",
"test",
"tests"
],
"dependencies": {
}
}
包的安装:
下面终于开始安装需要的包了!
比如我要安装一个 jquery,输入如下命令:
bower install jquery --save
或者根据版本进行安装,输入如下命令:
bower install jquery#1.0.0 --save
然后 bower 就会从远程下载 jquery 最新版本到你的 js/lib 目录下
其中 --save 参数是保存配置到你的 bower.json,你会发现 bower.json 文件已经多了一行:
"dependencies": {
"jquery": "~2.1.4"
}
包的信息:
比如我们想要查找 jquery 都有哪些个版本,输入如下命令:
bower info jquery
会看到 jquery 的 bower.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简明入门教程的更多相关文章
- OsharpNS轻量级.net core快速开发框架简明入门教程-Osharp.Redis使用
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-从零开始启动Osharp
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-代码生成器的使用
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-基于Osharp实现自己的业务功能
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-Osharp.Hangfire使用
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-Osharp.Permissions使用
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-切换数据库(从SqlServer改为MySql)
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- OsharpNS轻量级.net core快速开发框架简明入门教程-多上下文配置(多个数据库的使用)
OsharpNS轻量级.net core快速开发框架简明入门教程 教程目录 从零开始启动Osharp 1.1. 使用OsharpNS项目模板创建项目 1.2. 配置数据库连接串并启动项目 1.3. O ...
- Shader 简明入门教程
Unity3D的所有渲染工作都离不开着色器(Shader),如果你和我一样最近开始对Shader编程比较感兴趣的话,可能你和我有着同样的困惑:如何开始?Unity3D提供了一些Shader的手册和文档 ...
随机推荐
- 目标检测faster rcnn error == cudaSuccess (2 vs. 0) out of memory
想尝试 更深更强的网络,或者自己写了一个费显存的层,发现1080 ti的11G显存不够用了,老师报显存不够怎么办? Check failed: error == cudaSuccess (2 vs. ...
- nohup 写法
nohup 空格 php程序路径 空格 php脚本路径 >> .out日志路径 2>&1 &
- 在linux上安装docker
我的linux系统是阿里云服务器,是centos版本的. 前置条件 64-bit 系统 kernel 3.10+ 用uname -r命令检查内核版本,返回的值大于3.10即可. 用sudo wget ...
- 推荐几个IDEA插件,Java开发者撸码利器(转载)
推荐几个IDEA插件,Java开发者撸码利器. 这里只是推荐一下好用的插件,具体的使用方法不一一详细介绍. JRebel for IntelliJ 一款热部署插件,只要不是修改了项目的配置文件,用 ...
- kruskal(拓展)
kruskal是最小生成树的一种做法,即严格按照贪心思想将边从小到大排序,一个一个枚举能不能加入图中,知道生成一棵树,显然树为最小树. 鄙人觉得kruskal做法远不止如此,那种严格从小到大选边的做法 ...
- winfrom中pictureBox控件的部分使用方法
一.后台属性 1.pictureBox1.Image显示图片 2.pictureBox1.ImageLocation存储和提取图片路径 二.面板属性 1.Picturebox控件SizeMode属性 ...
- 云笔记项目-Spring事务学习-传播SUPPORTS
接下来测试事务传播属性SUPPORTS Service层 Service层将方法的事务传播属性设置为SUPPORTS LayerT层代码 package LayerT; import javax.an ...
- 复杂JSON对象的查询与合并
一个表里存放了全国各地地区.省.市.县区的数据,为了提高加载速度我保存成了本地的JSON文件 结构大致如下: [{ "text": "中华人民共和国", &qu ...
- 关于微信小程序appsecret保护的问题
本地后端代码中通常会配置 appid 和 appsecret,直接 push 到 公有 git 库会导致所有人可见.但其他人由于不是开发者有了别的项目的 secret 用处不大.但仍建议采用某种方法加 ...
- Codeforces Round #553 (Div. 2) B题
题目网址:http://codeforces.com/contest/1151/problem/B 题目大意:给定一个n*m的矩阵,问是否可以从每一行中选择一个数,使得这n个数异或大于0,如果可以还要 ...