bower学习笔记

bower

bower是什么

Web sites are made of lots of things — frameworks, libraries, assets, utilities, and rainbows. Bower manages all these things for you. ( from bower.io )

bower可以帮助你获取、安装前端框架、库、资源、实体,并且可以把你的配置保存在bower.json文件中,并且bower还为其他工具提供了钩子以便提高工作效率。

安装bower

因为bower是用node.js写的工具,所以需要使用npm安装(我假设你已经知道npm是什么了),执行npm install -g bower命令即可安装(在某些系统下,执行全局安装可能需要提供管理员权限,加上sudo就好了~),提醒一下,bower还需要git支持哦。

bower-基础使用

你可以执行bower install <package>来安装一个包,package处可以替换为:

  • 已经注册的包的名称 jquery
  • github上项目的名称 desandro/masonry
  • git为结尾的地址 git://github.com/user/package.git
  • URL http://example.com/script.js

有的童鞋可能会说,我怎么知道哪些项目在bower上注册过?bower官方考虑到这一点,为各位“程序猿”提供了一个查询页面(bower.io/search),至于具体使用方法嘛……

当你想记录下你的项目都用了哪些框架/资源的时候,你可以使用bower init命令新建一个bower.json文件记录下来~具体的使用方法后文介绍。

bower-进阶操作

先谈一谈上文提到过的bower.json文件:

  • name (required): 名称(必填);
  • version: 一个语义化的版本号,具体可以参考semver
  • main(string or array): main文件,类似于入口文件,可以是一个表示地址的字符串,也可以是一个数组;
  • ignore(array): 忽略项,你可以把你不想让bower收录的文件或者目录以数组的形式写在这里;
  • keywords(array of string) (recommended): 关键词,这个就不用解释了吧;
  • dependencies(hash): 你的项目的依赖项,你可以在这里一并指定其版本范围,具体可以参考semver
  • devDependencies(hash): 开发依赖,大体同上一项;
  • private(boolean): 如果你想让你的项目保持私有,并且不想被bower收录,那么请将本项设置为true

一个bower.json的样例文件是这样的:

{
  "name": "my-project",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "name": "version",
    "name": "folder",
    "name": "package"
  },
  "devDependencies": {
    "test-framework-name": "version"
  }
}

P.S.如果你想在安装包的时候,将其加入到bower.json文件中,你只需要在安装的时候,在bower install <name>命令后面加上--save或者--save-dev命令,就可以将其将入到dependencies或者devDependencies中。如果你想从本地的缓存中安装,在执行bower install <name>命令的时候,加上--offline命令即可。

部分bower命令简介

bower cache

bower cache clean <name>#<version> # 清除某个包、制定版本的缓存
bower cache list <name> # 列出指定包的缓存
# bootstrap=git://github.com/twbs/bootstrap.git#3.3.4
# jquery=git://github.com/jquery/jquery.git#2.1.3

bower help

bower help <command> # 查看某个命令的帮助信息

bower home

bower home <package>#<version> # 打开指定包的官方网站

bower info

bower info <package>#<version> [<property>] # 显示指定包的bower.json文件的内容及可用版本信息;如果指定property键,那就会返回相对应的值。

bower list

bower list
    -p --path 以json格式输出bower安装的包
    -r --relative 相对于当前文件夹输出安装的包

bower prune


bower prune # 删除无关的包

bower search

bower search    # 查找包

bower update

bower update <name> # 升级包

bower uninstall

bower uninstall <name> # 删除包
    -S --save 从bower.json文件中的“dependencies”中删除
    -D --save-dev 从bower.json文件中的“devDependencies”中删除

标签: bower, 前端