bower簡明入門教程

什麼是bower

Bower是一個客戶端技術的軟件包管理器，它可用於搜索、安裝和卸載如JavaScript、HTML、CSS之類的網絡資源。其他一些建立在Bower基礎之上的開發工具，如YeoMan和Grunt，這個會在以後的文章中介紹。

準備工作

1. 安裝node環境:node.js
2. 安裝Git，bower從遠程git倉庫獲取代碼包:git簡易指南

安裝bower

使用npm，打開終端，輸入：

npm install -g bower

其中-g命令表示全局安裝

開始使用

使用help命令查看幫助

自定義包的安裝目錄

首先進入項目目錄下，新建文件1.txt

然後命令行進入項目目錄下，輸入命令重命名該文件爲.bowerrc：

rename 1.txt .bowerrc

這個.bowerrc文件是自定義bower下載的代碼包的目錄，比如現在我的項目結構如下圖：

那我的.bowerrc文件內容如下：

{
  "directory" : "js/lib"
}

bower初始化

命令行進入項目目錄中，輸入命令如下：

bower init

會提示你輸入一些基本信息，根據提示按回車或者空格即可，然後會生成一個bower.json文件，用來保存該項目的配置，如下：

{
  "name": "bb_boot",
  "version": "0.0.1",
  "authors": [
    "savokiss <[email protected]>"
  ],
  "moduleType": [
    "amd"
  ],
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "js/lib",
    "test",
    "tests"
  ],
  "dependencies": {
  }
}

包的安裝

下面終於開始安裝需要的包了！
比如我要安裝一個jquery，輸入如下命令：

bower install jquery --save

然後bower就會從遠程下載jquery最新版本到你的js/lib目錄下
其中--save參數是保存配置到你的bower.json，你會發現bower.json文件已經多了一行：

  "dependencies": {
    "jquery": "~2.1.4"
  }

包的信息

比如我們想要查找jquery都有哪些個版本，輸入如下命令：

bower info jquery

會看到jquery的bower.json的信息，和可用的版本信息

可以看到jquery最新的兼容版版本爲1.11.3

包的更新

上面安裝的是最新版的高版本jquery，假如想要兼容低版本瀏覽器的呢？
已經查到兼容低版本瀏覽器的jquery版本爲1.11.3，下面直接修改bower.json文件中的jquery版本號如下：

  "dependencies": {
    "jquery": "~1.11.3"
  }

然後執行如下命令：

bower update

bower就會爲你切換jquery的版本了

包的查找

還有一個很重要的功能，就是包的查找，比如我想要安裝bootstrap的某個插件，但是記不住名字了，就可以直接在命令行輸入：

bower search bootstrap

bower就會列出包含字符串bootstrap的可用包了

包的卸載

卸載包可以使用uninstall 命令：

bower uninstall jquery

---