前端包管理工具Bower简介

11-28 前端 magicwt 3,143 views

前端包管理工具Bower简介

11-28 3,143 views

类似于在Java中使用Maven管理依赖，在前端可以使用Bower（http://bower.io/）管理包。类似于Maven中的pom.xml文件，Bower使用bower.json文件记录所需管理的包。

安装

Bower是一个命令行工具，可以使用node的npm命令进行安装：

npm install -g bower

Bower依赖node、npm和git，所以需要先安装node和git。

使用

安装包

可以使用“bower install”命令安装所需要的包，格式如下：

bower install <package>

其中package既可以直接使用包名，也可以使用包的GitHub地址，例如JQuery的安装可以使用以下命令：

# registered package
bower install jquery
# GitHub shorthand
bower install jquery/jquery
# Git endpoint
bower install git://github.com/jquery/jquery.git

执行命令后，JQuery的相关文件会被下载到bower_components目录下。

保存包

可以使用“bower init”命令保存所需要的包的信息，信息会被保存在bower.json文件中，bower.json示例如下：

{
  name: 'test',
  authors: [
    'magicwt'
  ],
  description: 'this is a tset',
  main: 'index.html',
  license: 'MIT',
  homepage: 'http://magicwt.com',
  ignore: [
    '**/.*'
  ],
  dependencies: {
    jquery: '~2.1.4'
  },
  keywords: [
    'bower'
  ]
}

{

name: 'test',

authors: [

'magicwt'

description: 'this is a tset',

main: 'index.html',

license: 'MIT',

homepage: 'http://magicwt.com',

ignore: [

'**/.*'

dependencies: {

jquery: '~2.1.4'

keywords: [

'bower'

]

}

使用包

Bower官方建议基于Bower API，结合其他前端工具（如Grunt，RequireJS，Yeoman等）来使用所管理的包，另外，也可以在页面中直接使用已安装的包，如直接引用已安装的JQuery：

<script src="bower_components/jquery/dist/jquery.min.js"></script>

1	<script src="bower_components/jquery/dist/jquery.min.js"></script>

版权属于: 我爱我家

原文地址: http://magicwt.com/2015/11/28/%e5%89%8d%e7%ab%af%e5%8c%85%e7%ae%a1%e7%90%86%e5%b7%a5%e5%85%b7bower%e7%ae%80%e4%bb%8b/

转载时必须以链接形式注明原始出处及本声明。