标签（空格分隔）： bower
bower是什么？
Bower是一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源
bower的优点
- 节省时间。学习Bower会为你节省寻找客户端的依赖关系的时间。每次需要jQuery的时候，都需要去jQuery网站下载包。但有了Bower，咱们只需要输入一个命令，jquery就会下载到本地计算机上，并且不需要去记版本号之类的东西，可以通过Bower的info命令去查看任意库的信息。
- 脱机工作。Bower会在用户主目录下创建一个.bower的文件夹，这个文件夹会下载所有的资源、并安装一个软件包使它们可以离线使用。可以创建一个名为bower.json的文件，在这个文件里你可以指定所有客户端的依赖关系，任何时候你需要弄清楚你正在使用哪些库，你可以参考这个文件。
- 让升级变得简单。假设某个库的新版本发布了一个重要的安全修补程序，为了安装新版本，你只需要运行一个命令，bower会自动更新所有有关新版本的依赖关系。
bower的使用
准备工作
安装bower，需要安装如下文件
安装和卸载bower
- 如果你已经安装了上面所说的所有必要文件，键入以下命令安装Bower：
$ npm install -g bower输入bower -v出现版本号表示安装成功- 卸载bower
$ npm install -g bower
使用bower安装和卸载包
Bower是一个软件包管理器，可以在应用程序中用它来安装新的软件包。
- 举例来看一下，使用Bower安装JQuery，在你想要安装该包的地方创建一个新的文件夹，键入如下命令：
$ bower install jquery
上述命令完成以后，你会在你刚才创建的目录下看到一个bower_components的文件夹。- 卸载包
$ bower uninstall jquery
bower.json文件的使用
bower.json文件的使用可以让包的安装更容易，可以在应用程序的根目录下创建一个名为“bower.json”的文件，并定义它的依赖关系。使用bower init命令来创建bower.json文件，一路回车。
{
"name": "test",
"authors": [
"liangyuanyuan <lvyweb@163.com>"
],
"description": "",
"main": "",
"license": "MIT",
"homepage": "",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"jquery": "^3.2.1",
"layer": "^3.0.3"
}
}
注意看，已经加入了jQuery、layer依赖关系。
现在假设也想用twitter bootstrap，我们可以用下面的命令安装twitter bootstrap并更新bower.json文件：
$ bower install bootstrap --save
这个命令会自动安装最新版本的bootstrap并更新bower.json文件：
{
"name": "test",
"authors": [
"liangyuanyuan <lvyweb@163.com>"
],
"description": "",
"main": "",
"license": "MIT",
"homepage": "",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"jquery": "^3.2.1",
"layer": "^3.0.3",
"bootstrap": "^3.3.7"
}
}
自定义包的安装目录
自定义bower包的安装目录
- 首先进入项目目录下，新建文件1.txt
- 然后命令行进入项目目录下，输入命令重命名该文件为.bowerrc
$ rename 1.txt .bowerrc这个.bowerrc文件是自定义bower下载的代码包的目录，比如现在我的项目结构如下图：
目录结构图
- 那我的.bowerrc文件内容如下
{
"directory" : "js/lib"
}
其他命令
| 命令 | 说明 |
|---|---|
bower help |
键入help 命令来查看bower可以完成那些操作 |
bower list |
显示所有安装应用程序的包 |
bower search bootstrap |
想在应用程序中使用bootstrap框架，但不确定包的名字，这时可以使用search 命令 |
bower info bootstrap |
如果想看到关于特定的包的信息，可以使用info 命令来查看该包的所有信息： |
网友评论