前端开发bower包管理器

Bower 是 twitter 推出的一款包管理工具，基于nodejs的模块化思想，他能够很好的帮助你帮你解决js的依赖管理，好比jquery angular bootstrap 等等。

能够很方便的对这些包进行下载升级删除等等。

下面与你们分享下本身简单学到的知识。

如下都是基于windows用户。

一、安装node

　bower插件是经过npm, Node.js包管理器安装和管理的

　因此要先安装nodejs，新版nodey已经集成安装npm了，因此咱们能够直接使用npm   node-v0.10.29-x64.msi 提取码：kj9b

二、 安装 msysgit

　 点我下载

　具体安装就不讲了 网上有不少。

二、安装bower

　 在cmd 下 全局安装bower

npm install -g bower

三、在项目目录运行

npm install --save-dev bower

四、生成bower.json 配置文件

若是你的项目有不少依赖，你总不想每次都一个个的从新安装吧？ 这样咱们就须要用到 bower.json配置文件了，全部依赖都会记录在里面，这样生成,如图一步步完成

bower init

五、安装依赖包

这时咱们已经能够安装依赖包了，咱们先安装个jquery和bootstrap

bower install --save-dev jquery bootstrap

这时你会忽然发现出错了，[ENOGIT git is not installed or not in the PATH]

别着急这是由于前面安装的msysgit 没有写到环境变量里，咱们这样解决：

假如你的git安装目录是"C:\Program Files (x86)\Git"，在path中加入git的bin和cmd目录，如C:\Program Files (x86)\Git\bin;C:\Camnpr\Program Files (x86)\Git\cmd

若是这个方法不起做用是由于，你修改的path没有生效， 你须要从新启动电脑，有一个方法不须要重启电脑就立马生效，很好用，看下面

在cmd中输入下面代码 并回车 而后关闭cmd窗口。

path PATH=xxxx

 

在你的项目文件夹从新打开cmd窗口，继续运行安装依赖包的代码

这时你会发现 哇塞 下载下来了！路径是什么？你会发现下载到一个叫bower_components的文件夹去了，这个有点。。好尴尬啊~

能不能改路径呢？能！这样作

在项目根下建立一个名为.bowerrc 的文件，内容为（目录为项目根目录 ./lib/）

{
  "directory" : "lib"
}

你确定怀疑我是怎么创建的无名文件。。 - _ -

在项目根目录的cmd中输入并回车。去看文件夹 文件出来了，别谢我，我叫红领巾！

type null > .bowerrc

咱们继续。。。。

把前面下载的手动删掉，再从新

bower install

此次为何后面没有跟着 jquery啊？ 由于前面已经写入bower.json了呀！知道配置文件的好处了吧？

到此位置安装完成哦。

六、使用

我想能来看这篇文章的同窗都应该知道一个js文件如何引用了吧？

但是目录结构。。。看图（看不懂别打我啊 我躲。。）

你应该会问 这目录这么多文件，真正上线的时候咋办？

其实这个问题嘛！这个和gulp就又挂上勾了，要在gulp里对其进行选择性编译哇。哇卡卡。

 

好啦 就到这里啦~ 有问题随时沟通交流  你们一块儿进步