Web前端开发工具——bower依赖包管理工具

215 阅读 0 评论 142 点赞

我是靠谱客的博主阔达荷花，最近开发中收集的这篇文章主要介绍Web前端开发工具——bower依赖包管理工具，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

Bower 是 twitter 推出的一款包管理工具，基于nodejs的模块化思想，把功能分散到各个模块中，让模块和模块之间存在联系，通过 Bower 来管理模块间的这种联系。

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

a)注册机制：每个包需要确定一个唯一的 ID 使得搜索和下载的时候能够正确匹配，所以包管理工具需要维护注册信息，可以依赖其他平台。

b)文件存储：确定文件存放的位置，下载的时候可以找到，当然这个地址在网络上是可访问的。

c)上传下载：这是工具的主要功能，能提高包使用的便利性。比如想用 jquery 只需要 install 一下就可以了，不用到处找下载。上传并不是必备的，根据文件存储的位置而定，但需要有一定的机制保障。

d)依赖分析：这也是包管理工具主要解决的问题之一，既然包之间是有联系的，那么下载的时候就需要处理他们之间的依赖。下载一个包的时候也需要下载依赖的包。

由于bower是基于nodejs开发的，所以你首先必须得有个nodejs环境，至于这么安装nodejs网上一大堆教程，对了使用bower还需要安装git，这里就不多说了。

bower带来的好处

　　假如你有一个项目，里面需要用到了JQuery在正常情况下我们需要到jQuery官方网站下载库，这样的话，每次jquery更新，我们又要到jQuery官方下载，那这样的话就很麻烦了，如果有一款工具能够输入一个命令让我们选择要下载的版本，并且如果想把我们项目里面的所有库更新到最新版也只需要输入一个命令那是不是很方便，bower的另外一个好处就是如果你安装bootstrap那么它会自动下载jquery，因为bootstrap依赖了jquery，简单的来说只要我们下载的那个库依赖了另外的库那么bower会自动帮我们下载依赖的库，bower就是这么强大。

bower的安装

　　npm install -g bower 表示安装到全局环境

bower的使用

　　1. 通过bower下载库

　　　　bower install (包的名称如：jquery)[#版本如：#1.7] 版本可选，如果没有写，默认下载最新版

　　　　如:bower install bootstrap#2.2

　　2. 如果需要更新所以的库，我们可以输入以下命令

　　　　bower update

如果需要生成一个你下载个包的所以信息，比如你在一个团队中，你想让其他人知道你都用了哪些库，并且它们的版本是多少，那么我们可以通过以下命令来完成。
　　我们需要先初始化一个包描述。它会在你的当前执行环境目录中创建一个bower.json的目录

　　　　`bower init -y`

　　然后通过

　　　　`bower install jquery --save`

　　它会在bower.json文件中加入jquery的版本信息，如果你想添加多个可以通过空格bower install jquery bootstrap less --save

以下是bower.json文件的内容

{
"name": "down",
"authors": [
"xxxxxxxx"
],
"description": "",
"main": "",
"moduleType": [],
"license": "MIT",
"homepage": "",
"private": true,
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"bootstrap": "^3.3.6",
"less": "^2.6.1",
"jquery": "^2.2.2"
}
}

　　当然如果你是nodejs新手或许你会有些茫然，因为这里并不是一个nodejs基础教程，如果你想了解想学node的话还需要到网络中学习。

　　bower除了这些好处以为，还有一些更加强大的功能，那就需要大家去发现了，我这里就不再介绍了，毕竟我也是刚刚开始学习node

------------------------------------------------------分割线---------------------------------------

bower与npm的关系

　　　安装bower需要通过npm来安装

bower与npm的区别：

　　1. 在之前的npm版本中，它不能共享依赖的代码，也是就说，在以前的npm版本中，如果你下载了一个bootstrap，因为bootstrap是依赖jquery的，所以它会把jquery也下载下来，但是如果你的另外一个库也用到了jquery，那么它也会去下载一个jquery，这样的话，代码就重复了。

　　它们的结构就像这样：

　　　　bootstrapjQuery
　　　　xxxxxxxxxjQuery

　　它们重复了对吧，不过好像在npm的最新版本中解决了这个问题。

　　2. npm 会将开发环境一起下载下来，bower 只会下载编译后的前度模块。

　　3. NPM主要运用于Node.js项目的内部依赖包管理，安装的模块位于项目根目录下的node_modules文件夹内。而Bower大部分情况下用于前端开发，对于CSS/JS/模板等内容进行依赖管理，依赖的下载目录结构可以自定义。 -- 本段内容是在网上找到的。

　　所谓的自定义目录结构的意思是说，你在那个文件目录打开的bower，那么它就会在那个文件下，下载你需要的包，而npm就不支持这个。

总结：我们可以简单的来理解npm是用来管理nodejs模块的也就是包，而bower是用来管理我们前端库的。

有关Web前端开发工具——bower依赖包管理工具小编就给大家介绍到这里，希望对大家有所帮助！