红联Linux门户
Linux帮助

ubuntu14.04 bower的使用

发布时间:2016-03-09 10:30:57来源:linux网站作者:Stephen102

1.Bower是什么?

Bower A package manager for the web

ubuntu14.04 bower的使用

Bower是一个客户端技术的软件包管理器,它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。他作为一个js依赖管理的工具,提供一种理想包管理方式,借助了npm的一些思想,为我们提供一个舒服的开发环境。


2.Bower的安装

我的安装环境是在ubuntu14.04
2.1.前提条件是需要安装nodejs和git,bower是从git上下载网络资源的。
2.2.使用nodejs的npm来安装bower

npm install -g bower

其中-g命令表示全局安装
2.3.检验是否安装成功

bower -v

如果安装成功输出:

1.7.7


3.Bower的使用
3.1.查看bower功能支持

stephen@stephen:~$ bower

Usage:

bower <command> [<args>] [<options>]
Commands:
cache                   Manage bower cache
help                    Display help information about Bower
home                    Opens a package homepage into your favorite browser
info                    Info of a particular package
init                    Interactively create a bower.json file
install                 Install a package locally
link                    Symlink a package folder
list                    List local packages - and possible updates
login                   Authenticate with GitHub and store credentials
lookup                  Look up a package URL by name
prune                   Removes local extraneous packages
register                Register a package
search                  Search for a package by name
update                  Update a local package
uninstall               Remove a local package
unregister              Remove a package from the registry
version                 Bump a package version
Options:
-f, --force             Makes various commands more forceful
-j, --json              Output consumable JSON
-l, --loglevel          What level of logs to report
-o, --offline           Do not hit the network
-q, --quiet             Only output important information
-s, --silent            Do not output anything, besides errors
-V, --verbose           Makes output more verbose
--allow-root            Allows running commands as root
-v, --version           Output Bower version
--no-color              Disable colors
See 'bower help <command>' for more information on a specific command.

3.2.创建测试bower_test project

stephen@stephen:~$ mkdir bower_test
stephen@stephen:~$ cd bower_test
stephen@stephen:~/bower_test$ mkdir app
stephen@stephen:~/bower_test$ tree
.
└── app

1 directory, 0 files

目前我们的目录结构
3.3.我们在根目录(/bower_test)下创建**.bowerrc**文件
3.4.在2创建的文件中添加如下内容:

{
"directory" : "app"
}

**.bowerrc**文件是自定义bower下载的代码包的目录位置,即我们下载的资源将放在app/下面
3.5.查看当前的目录结构

stephen@stephen:~/bower_test$ tree -a
.
├── app
└── .bowerrc

3.6.brower的初始化工作

在我们.bowerrc同级,也就是主目录下执行命令**bower init**,根据提示会生成bower.json的配置文件。

stephen@stephen:~/bower_test$ bower init
? name bower_test
? description "test for bower"
? main file "test"
? what types of modules does this package expose?
? keywords "test keywords"
? authors Stephen Huang <stephen_huang_@hotmail.com.com>
? license MIT
? homepage www.baidu.com
? set currently installed components as dependencies? Yes
? add commonly ignored files to ignore list? Yes
? would you like to mark this package as private which prevents it from being accidentally published to the registry? Yes

{
name: 'bower_test',
authors: [
'Stephen Huang <stephen_huang_@hotmail.com.com>'
],
description: '"test for bower"',
main: '"test"',
moduleType: [],
keywords: [
'"test',
'keywords"'
],
license: 'MIT',
homepage: 'www.baidu.com',
private: true,
ignore: [
'**/.*',
'node_modules',
'bower_components',
'app',
'test',
'tests'
]
}

? Looks good? Yes

目前的结构

stephen@stephen:~/bower_test$ tree -a
.
├── app
├── bower.json
└── .bowerrc

1 directory, 2 files

3.7.包的安装

如果我们现在需要安装bootstrap

bower install jquery --save

然后bower就会从远程下载jquery最新版本到你的app/目录下

stephen@stephen:~/bower_test$ bower install jquery --save
bower jquery#*                  cached git://github.com/jquery/jquery-dist.git#2.2.1
bower jquery#*                validate 2.2.1 against git://github.com/jquery/jquery-dist.git#*
bower jquery#^2.2.1            install jquery#2.2.1

jquery#2.2.1 app/jquery

其中–save参数是保存配置到你的bower.json,你会发现bower.json文件已经多了一行

"dependencies": {
"jquery": "^2.2.1"
}

3.8.包的信息

bower info jquery

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

bower update

3.10.包的卸载

bower uninstall jquery

3.11.包的查找

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

bower search bootstrap


4.参考

1.官网:http://bower.io/


本文永久更新地址:http://www.linuxdiyf.com/linux/18752.html