原因:2016年11月23日 星期三 繼Angularjs項目(1)后接著總結開發的經驗與遇到的問題。
說明:本記錄主要介紹bower
與MVC框架
。
我的博客:http://minichao.me
Bower
Bower 是twitter
推出的一款包管理工具,基于nodejs的模塊化思想,把功能分散到各個模塊中,讓模塊和模塊之間存在聯系,通過 Bower 來管理模塊間的這種聯系。
包管理工具一般有以下的功能:
- 1.注冊機制:每個包需要確定一個唯一的 ID 使得搜索和下載的時候能夠正確匹配,所以包管理工具需要維護注冊信息,可以依賴其他平臺。
- 2.文件存儲:確定文件存放的位置,下載的時候可以找到,當然這個地址在網絡上是可訪問的。
- 3.上傳下載:這是工具的主要功能,能提高包使用的便利性。比如想用 jquery 只需要 install 一下就可以了,不用到處找下載。上傳并不是必備的,根據文件存儲的位置而定,但需要有一定的機制保障。
- 4.依賴分析:這也是包管理工具主要解決的問題之一,既然包之間是有聯系的,那么下載的時候就需要處理他們之間的依賴。下載一個包的時候也需要下載依賴的包。
nodejs
是時下流行的javascript
運行環境,而npm
就是其管理工具,而bower是解決js依賴關系的包工具,比如需要引入某個模塊功能,只需bower install xx
即可自動引入前置環境。
-
這里為什么要提到bower呢,現在下圖是通過Netbeans建立的包含Angularjs Seed文件的項目文件圖:
Flod
Bower.json - Ubuntu下Ctrl+H即可顯示隱藏文件,如圖中左側,為.bowerrc文件,它的作用就是在這一級目錄下使用Bower時,bower下載的文件所要去的地址,右側的bower.json是記錄文件,這是angularjs-seed自動生成的(也可以通過bower init在當前目錄下生成),當工程發生位置變更時,為了減少存儲負擔,無需轉移依賴庫文件,只需在每次安裝依賴時
bower install --save xx
其中xx為要安裝的包,而在安裝后,就會自動記錄到bower.json的dependencies中。 - 當新建了Angularjs工程后,由于只是下載了angularjs-seed(包含bower.json),而并無包依賴文件,故在這一級目錄下命令行輸入
bower install
,bower就會自動從json文件中提取記錄,下載想要的對應版本的依賴文件了。
MVC
- 上一節簡單介紹了Angularjs的應用引導,依賴注入,以及路由,這里介紹Angualrjs與MVC。Apache Struts,Spring MVC和Zend Framework等MVC框架在過去多年中是Web開發框架的領導者,對于這些框架,完全運行在服務器中,所有的功能,例如數據庫、業務邏輯、現實邏輯和UI活動都在服務器中完成,因此要消耗服務器的內存和資源,雖然這種設計適用于大多數情況,但是近年來移動端的發展,這種設計模式在移動設備中是不可行的(原因自行查找,不再贅述),這里只介紹Angulajrs的MVC,與上述框架不同的是,Angularjs的視圖、模型、控制器等模塊都在web瀏覽器,或用戶的設備中運行,解放了服務器,或者只讓服務器處理業務邏輯和數據存儲,極大的改善了用戶體驗。
Angulajrs的視圖(MVC中的V)
- 基本上只需要使用簡單的HTML和CSS,很簡單,不做介紹
Angularjs的模型(MVC中的M)
- Angularjs在$scope對象中存儲應用的模型,附在DOM上,如果想獲取模型,可以使用賦給$scope對象的數據屬性。
Angularjs的控制器(MVC中的C)
- 技術核心,controller,要講的太多,后文介紹。