继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

bower简明入门教程(转)

萌丶小怪
关注TA
已关注
手记 29
粉丝 14
获赞 258
  1. 什么是bower

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

  2. 列表项

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

  1. 安装bower

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

  1. bower初始化

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

{
  "name": "twilight",
  "authors": [
    "zhangz <@qq.com>"
  ],
  "description": "",
  "main": "",
  "license": "MIT",
  "homepage": "",
  "private": true,
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {

  }
}
  1. 包的安装
    比如我要安装一个jquery,输入如下命令:bower install --save jquery
    然后bower就会从远程下载jquery最新版本到你的js/lib目录下
    其中--save参数是保存配置到你的bower.json,你会发现bower.json文件已经多了一行:
 "dependencies": {
    "jquery": "~2.1.4"
  }
6.包的信息

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

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

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

7.包的更新

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

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

然后执行命令:bower update,bower就会为你切换jquery的版本了

8.包的查找

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

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

9.包的卸载

卸载包可以使用uninstall 命令:bower uninstall jquery

10.自定义包的安装目录

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

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

rename 1.txt .bowerrc
这个.bowerrc文件是自定义bower下载的代码包的目录,比如现在我的项目结构如下图:
图片描述
那我的.bowerrc文件内容如下:

{
  "directory" : "js/lib"
}
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP