Visual Studio 2015 開始支援 Bower，使用時需先為專案加入 Bower Configuration File。 {% img /images/posts/BowerInVS2015/1.png %} Bower Configuration File 加入後，也會順帶加入 .bowerrc 檔，這邊會指定 Bower 套件放置的位置。 {% img /images/posts/BowerInVS2015/2.png %} 這邊我們可以開啟 bower.json 檔案設定所要使用的 Bower 套件。 {% img /images/posts/BowerInVS2015/3.png %} 或是使用 Manage Bower Packages... 加入 Bower 套件。 {% img /images/posts/BowerInVS2015/4.png %} {% img /images/posts/BowerInVS2015/5.png %} 在設定 Bower 套件時，我們可能會需要調用 Bower 指令查閱一些資訊，像是 Bower 套件的版本等，這邊可透過 Package Manager Console 視窗調用。 {% img /images/posts/BowerInVS2015/6.png %} 設定完按下編譯或是滑鼠右鍵快顯選單中的 Restore Packages 選單選項，即可透過 Bower 下載 Bower 套件。

Bower prune 可用來移除未被使用的 bower 套件。 如果有 Bower 套件未被 bower.json 檔參照到，當呼叫 bower prune 時就會被移除。 像是這邊本地已安裝了 Bootstrap 與 JQuery 套件，但這套件並未在 bower.json 有被參照，因此當呼叫了 bower prune 時就會被移除。 {% img /images/posts/BowerPrune/1.png %}

Bower lookup 可以查閱 Bower 套件的位置。 使用方式如下： bower lookup <package> 像是要查閱 jQuery 套件的位置，可以輸入 bower lookup jquery。 {% img /images/posts/BowerLookup/1.png %}

Bower info 可用來查詢 Bower 套件的資訊。 使用方式如下： bower info <package> bower info <package>#<version> 如果要查詢 jQuery 套件的資訊，可以輸入 bower info jquery。這邊可以看到他會顯示該套件所用的 bower.json 資訊，以及可使用的版本。 {% img /images/posts/BowerInfo/1.png %} {% img /images/posts/BowerInfo/2.png %} 如果要查閱特定版本，像是 jQuery 1.0.1，可以輸入命令 bower info jquery#1.0.1。 {% img /images/posts/BowerInfo/3.png %}

Bower cache clean 可用來清除 Bower 套件的快取。 只要叫用命令 bower cache clean 即可。 {% img /images/posts/BowerCacheClean/1.png %}

Bower cache list 可用來查閱 bower 套件 cache 的情況。 Bower 套件在使用時若有需要，Bower 會將套件快取在本地，像是用 bower install 或是 bower info 叫用時就會進行對應的快取。 像是筆者前面安裝了 Bootstrap，用 bower cache list 查看就會查閱到 Bootstrap 與 jQuery 已經進行了本地快取。 {% img /images/posts/BowerCacheList/1.png %}

Bower update 會根據 bower.json 的設定下去更新 bower 套件。 使用方式如下： bower update bower update <package> 像是這邊筆者安裝了 jQuery 1.0.1 的版本，開啟 bower.json 將其版號改為 2.1.4，接著運行 bower update jquery，安裝的 jQuery 版本就會變為 2.1.4。 {% img /images/posts/BowerUpdate/1.png %}

Bower list 可用來列出安裝的 bower 套件，以及其之間的依賴關係。 使用方式如下： bower list 像是如果本地已安裝了 jQuery 與 Bootstrap。 {% img /images/posts/BowerList/1.png %} 那當輸入命令 bower list，則會像下面這樣列出安裝的套件，且會用樹狀結構顯示其依賴關係。 {% img /images/posts/BowerList/2.png %}

Bower uninstall 可用來移除 bower 的 package。 使用方式如下： bower uninstall <package> 像是要移除安裝的 jQuery bower 套件，可以下 bower uninstall jquery。 {% img /images/posts/BowerUninstall/1.png %} {% img /images/posts/BowerUninstall/2.png %}

Bower install 可用來安裝 bower 的 package 以及其依類的套件。 使用方式如下： bower install bower install <package> bower install <package>#<version> bower install 會依據 bower.json 的設定下去安裝 bower 套件。 如果指定安裝 bower 套件，可以直接在 bower install 後接上 bower 套件的名稱。像是要安裝 jQuery，我們就可以下 bower install jquery。 {% img /images/posts/BowerInstall/1.png %} {% img /images/posts/BowerInstall/2.png %} 如果要安裝特定版本的 bower 套件，就是在 bower install 後接上 bower 套件名稱，再用 # 串接 bower 套件的版本。像是 bower install jquery#2.2.0。 如果想在安裝時一併寫入 bower.json 檔，可加帶 –save。

Bower search 可用來搜尋 bower 的 package。 使用方式如下： bower search <package> 像是要搜尋 jQuery 的 package，就可以下 bower search jquery。 {% img /images/posts/BowerSearch/1.png %}

Bower init 可用來建立 bower.json 檔。 只要呼叫 bower init，然後依序填寫詢問的問題即可： {% img /images/posts/BowerInit/1.png %} 填完後即會在當前目錄產生對應的 bower.json 檔。 {% img /images/posts/BowerInit/2.png %}

Bower help command 可以用來查詢 bower 的命令。 使用方式如下： bower help bower help <command> 如果要查閱整個 Bower 有哪些命令可以使用，可直接叫用 bower help。 {% img /images/posts/BowerHelpCommand/1.png %} 如果要查閱 Bower 的某個命令用法，像是 install 命令，可叫用 bower help install。 {% img /images/posts/BowerHelpCommand/2.png %}

Bower 依賴於 Node.js 與 Git，安裝 Bower 需透過 Node.js 內的 npm，只要透過下列 npm 命令安裝即可： npm install -g bower {% img /images/posts/InstallBower/1.png %} 而 Bower 套件的安裝與使用會用到 Git，所以記得也要將之安裝。 如果是 Ubuntu 用戶，可以透過下列命令將整個環境安裝起來： sudo apt-get purge nodejs npm sudo apt-get update sudo apt-get install -y python-software-properties python g++ make sudo add-apt-repository ppa:chris-lea/node.js sudo apt-get update sudo apt-get install -y nodejs sudo apt-get install -y git sudo npm install -g bower