閱讀43 返回首頁    go 阿裏雲 go 技術社區[雲棲]

《JavaScript開發框架權威指南》——1.4　查找、添加和刪除Bower包

本節書摘來自異步社區《JavaScript開發框架權威指南》一書中的第1章，第1.4節，作者：【美】Tim Ambler , Nicholas Cloud著，更多章節內容可以訪問雲棲社區“異步社區”公眾號查看

1.4　查找、添加和刪除Bower包

Bower的命令行工具提供了很多有用的命令，用於查找、安裝或者刪除包。我們來看一下這些命令是如何簡化項目外部依賴項的管理工作的。

1.4.1　查找包
Bower改善開發流程的一個主要途徑就是為第三方庫提供集中式的注冊中心。如清單所示，要在Bower的注冊中心裏進行搜索的話，隻需將search參數傳給Bower即可，search後麵跟著要查找的關鍵詞。下麵列出的僅為查詢結果的一個小片段。

清單1-4　在Bower中查找jQuery

$ bower search jquery

Search results:

    jquery git://github.com/jquery/jquery.git
    jquery-ui git://github.com/components/jqueryui
    jquery.cookie git://github.com/carhartl/jquery-cookie.git
    jquery-placeholder git://github.com/mathiasbynens/jquery-placeholder.git

1.4.2　添加包
每一條搜索結果都由包的注冊名與其GitHub倉庫的URL構成，由此URL可以直接訪問該包的所有信息。找到所需的包後，即可將其添加到項目中，如清單所示。

清單1-5　將jQuery添加到項目中

$ bower install jquery --save
bower jquery#*            cached git://github.com/jquery/jquery.git#2.1.3
bower jquery#*          validate 2.1.3 against git://github.com/jquery/jquery.git#*
bower jquery#>= 1.9.1    cached git://github.com/jquery/jquery.git#2.1.3
bower jquery#>= 1.9.1  validate 2.1.3 against git://github.com/jquery/jquery.git#>= 1.9.1
bower jquery#>= 1.9.1    cached git://github.com/jquery/jquery.git#2.1.3
bower jquery#>= 1.9.1  validate 2.1.3 against git://github.com/jquery/jquery.git#>= 1.9.1
bower jquery#>= 1.9.1   install jquery#2.1.3

jquery#2.1.3 public/bower_components/jquery

注意：
　

Bower並沒有在其注冊中心中托管與包相關的任何文件，這個任務是由GitHub完成的。盡管理論上講，可以將軟件包托管到任何URL，但是大多數公有域的包還是在GitHub上。
注意清單中跟在Bower的install命令後麵的--save選項。默認情況下，install命令僅將包添加到項目中，而不更新項目清單。--save選項指示Bower將該包永久保存在項目的依賴列表裏麵。

清單中顯示的是本章示例項目中的HTML代碼。利用Bower將jQuery添加到項目中後，即可像加載其他庫一樣，通過script標簽將其加載到頁麵中。

清單1-6　來自示例項目的HTML，該文件引用了剛剛添加的jQuery庫

// example-jquery/public/index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Bower Example</title>
    </head>
    <body>
        <div ></div>
        <script src="/bower_components/jquery/dist/jquery.min.js"></script>
        <script>
        $(document).ready(function() {
            $('#container').html('<p>Hello, world!</p>');
        });
        </script>
    </body>
</html>

開發版依賴項（Development Dependencies）
默認情況下，Bower安裝的所有包都是“產品”版的依賴項（Production Dependencies）。傳入--save-dev選項可以改變這一行為，從而安裝的所有包都將被標記為“開發”版。開發版軟件包通常僅用於開發目的，而不麵向項目的最終用戶。

一旦準備好將應用部署到生產環境中，就可以按照下麵的方法，讓Bower將項目依賴項切換到產品版，從而使項目構建更加緊湊，不含與最終用戶無關的文件。

$ bower install --production
1.4.3　刪除包
刪除包的方法非常簡單。與前麵一樣，我們通過添加--save選項來更新Bower的清單文件，以反映對項目所做的更改。

$ bower uninstall jquery --save

最後更新：2017-06-05 14:01:51

  上一篇：go  《JavaScript開發框架權威指南》——1.5　語義化版本控製
  下一篇：go  《JavaScript開發框架權威指南》——1.3　清單文件（Manifest）