Bower 使用

时间 2020-05-11

标签 bower 使用繁體版

原文原文链接

Bower：客户端库管理工具javascript

概述

随着网页功能变得愈来愈复杂，同一张网页加载多个JavaScript函数库早已经是屡见不鲜。开发者愈来愈须要一个工具，对浏览器端的各类库进行管理，好比搜索、自动安装\卸载、检查更新、确保依赖关系等等。Bower就是为了解决这个问题而诞生的针对浏览器端的库管理工具。html

Bower基于node.js，因此安装以前，必须先确保已安装node.js。java

$ sudo npm install bower --global

运行上面的命令之后，Bower就已经安装在你的系统中了。运行帮助命令，查看Bower是否安装成功。node

$ bower help

下面的命令能够更新或卸载Bower。jquery

# 更新 $ sudo npm update -g bower # 卸载 $ sudo npm uninstall --global bower

经常使用操做

项目初始化

在项目根目录下，运行下面的命令，进行初始化。git

$ bower init

经过回答几个问题，就会自动生成bower.json文件。这是项目的配置文件，下面是一个例子。github

{ "name": "app-name", "version": "0.1.0", "main": ["path/to/app.html", "path/to/app.css", "path/to/app.js"], "ignore": [".jshintrc","**/*.txt"], "dependencies": { "sass-bootstrap": "~3.0.0", "modernizr": "~2.6.2", "jquery": "latests" }, "devDependencies": {"qunit": ">1.11.0"} }

有了bower.json文件之后，就能够用bower install命令，一会儿安装全部库。ajax

$ bower install

bower.json文件存放在库的根目录下，它的做用是（1）保存项目的库信息，供项目安装时使用，（2）向Bower.com提交你的库，该网站会读取bower.json，列入在线索引。npm

$ bower register <my-package-name> <git-endpoint> # 实例：在 bower.com 登记jquery $ bower register jquery git://github.com/jquery/jquery

注意，若是你的库与现有的库重名，就会提交失败。

库的安装

bower install命令用于安装某个库，须要指明库的名字。

$ bower install backbone

Bower会使用库的名字，去在线索引中搜索该库的网址。某些状况下，若是一个库很新（或者你不想使用默认网址），可能须要咱们手动指定该库的网址。

$ bower install git://github.com/documentcloud/backbone.git $ bower install http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js $ bower install ./some/path/relative/to/this/directory/backbone.js

上面的命令说明，指定的网址能够是github地址、http网址、本地文件。

默认状况下，会安装该库的最新版本，可是也能够手动指定版本号。

$ bower install jquery-ui#1.10.1

上面的命令指定安装jquery-ui的1.10.1版。

若是某个库依赖另外一个库，安装时默认将所依赖的库一块儿安装。好比，jquery-ui依赖jquery，安装时会连jquery一块儿安装。

安装后的库默认存放在项目的bower_components子目录，若是要指定其余位置，可在.bowerrc文件的directory属性设置。

库的搜索和查看

bower search命令用于使用关键字，从在线索引中搜索相关库。

bower search jquery

上面命令会获得下面这样的结果。

Search results:

    jquery git://github.com/components/jquery.git
    jquery-ui git://github.com/components/jqueryui
    jquery.cookie git://github.com/carhartl/jquery-cookie.git
    jquery-placeholder git://github.com/mathiasbynens/jquery-placeholder.git
    jquery-file-upload git://github.com/blueimp/jQuery-File-Upload.git
    jasmine-jquery git://github.com/velesin/jasmine-jquery
    jquery.ui git://github.com/jquery/jquery-ui.git
    ...

bower info命令用于查看某个库的详细信息。

bower info jquery-ui

查看结果会列出该库的依赖关系（dependencies），以及能够获得的版本（Available versions）。

库的更新和卸载

bower update用于更新一个库，将其更新为最新版本。

$ bower update jquery-ui

若是不给出库名，则更新全部库。

bower uninstall命令用于卸载指定的库。

$ bower uninstall jquery-ui

注意，默认状况下会连所依赖的库一块儿卸载。好比，jquery-ui依赖jquery，卸载时会连jquery一块儿卸载，除非还有别的库依赖jquery。

列出全部库

bower list或bower ls命令，用于列出项目所使用的全部库。

Bower list
Bower ls

配置文件.bowerrc

项目根目录下（也能够放在用户的主目录下）的.bowerrc文件是Bower的配置文件，它大概像下面这样。

{ "directory" : "components", "json" : "bower.json", "endpoint" : "https://Bower.herokuapp.com", "searchpath" : "", "shorthand_resolver" : "" }

其中的属性含义以下。

directory：存放库文件的子目录名。
json：描述各个库的json文件名。
endpoint：在线索引的网址，用来搜索各类库。
searchpath：一个数组，储存备选的在线索引网址。若是某个库在endpoint中找不到，则继续搜索该属性指定的网址，一般用于放置某些不公开的库。
shorthand_resolver：定义各个库名称简写形式。