FED实验室 - 专注WEB端开发和用户体验

Bower——前端开发包管理工具

AUTOMATION 煦涵 6802℃ 0评论

bower

Bower 是 twitter 推出的一款包管理工具,基于nodejs的模块化思想,把功能分散到各个模块中,让模块和模块之间存在联系,通过 Bower 来管理模块间的这种联系。官网请戳这里:http://bower.io/

包管理工具一般有以下的功能:

  • a)注册机制:每个包需要确定一个唯一的 ID 使得搜索和下载的时候能够正确匹配,所以包管理工具需要维护注册信息,可以依赖其他平台。
  • b)文件存储:确定文件存放的位置,下载的时候可以找到,当然这个地址在网络上是可访问的。
  • c)上传下载:这是工具的主要功能,能提高包使用的便利性。比如想用 jquery 只需要 install 一下就可以了,不用到处找下载。上传并不是必备的,根据文件存储的位置而定,但需要有一定的机制保障。
  • d)依赖分析:这也是包管理工具主要解决的问题之一,既然包之间是有联系的,那么下载的时候就需要处理他们之间的依赖。下载一个包的时候也需要下载依赖的包。

一、Bower的安装

安装依赖:NodeJS、NPM、Git

$ npm install -g bower

二、安装包

通过bower install安装包,安装到bower_components/文件夹中。

$ bower install <package>

其中包的形式的可以是GitHub简写、一个git地址、一个url或者其他。

# registered package
$ bower install jquery
# GitHub shorthand
$ bower install desandro/masonry
# Git endpoint
$ bower install git://github.com/user/package.git
# URL
$ bower install http://example.com/script.js

三、搜索包

发现所有的包,或者指定的包:

$ bower search
$ bower search <name>

四、bower.json

包能被定义到清单文件bower.json中,和nodejs的package.json文件、Ruby的gemfile文件相似。
可以创建一个bower.json文件通过bower init命令:

$ bower init

bower.json文件各选项定义如下:
name(必填):包的名称
version:语义性的版本号
main(字符串或者数组):包的主要Git端点
ignore(数组):在生产环境中,安装你的包时,Bower会忽略指定的路径。
dependencies(hash结构) :依赖的包,可以指定版本号
devDependencies :开发时的依赖包
private :true,保存包私有的,不会注册到git

{
  "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>"
  }
}

 

五、保存依赖

使用bower install --save 将增加到你的项目的的bower.json文件中的dependencies 数组中。

# install package and add it to bower.json dependencies
$ bower install <package> --save

相似的,使用bower install --save-dev 将增加包到你的项目的bower.json文件中的devDependencies数组中。

# install package and add it to bower.json devDependencies
$ bower install <package> --save-dev

六、卸载包

可以从你的bower_components文件中卸载一个本地包。

$ bower uninstall <name> [<name> ..] [<options>]

uninstall 选项:
-S,--save:从项目的bower.json文件中移除卸载的包的依赖(更新dependencies)
-D,--save-dev:从项目的bower.json文件中移除卸载的包的依赖(更新devDependencies)

七、问题

Q:安装bower时,报Bower : ENOGIT git is not installed or not in the PATH错误?
A:
1)windows环境
需要配置你的Git到path,假如你的git安装目录是"C:\Program Files (x86)\Git",在path中加入git的bin和cmd目录,如C:\Program Files (x86)\Git\bin;C:\Program Files (x86)\Git\cmd
2)Ubuntu:
安装git:

$ apt-get install git

八、参考链接

官网:http://bower.io

下面是「FED实验室」的微信公众号二维码,欢迎扫描关注:

FED实验室

行文不易,如有帮助,欢迎打赏!

赞赏支持or喜欢 (0)or分享 (0)
捐赠共勉
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址