1.AngularJS Seed項目目錄結構
AngularJS官方網站提供了一個angular-phonecat項目，另外一個就是Angular-Seed項目。所以大多數團隊會基於Angular-Seed項目來開發，本文首先分析angular-seed項目的目錄結構。以及AngularJS團隊為我們做了什么事情，提供了我們真實開發最需要的框架結構。
這個項目僅僅是一個典型的AngularJS網絡應用程序的應用程序骨架。 您可以使用它來快速引導您的Angular webapp項目和搭建開發環境。
Angular Seed包含一個樣例AngularJS應用程序，並且預配置為安裝Angular框架和一系列用於即時Web開發滿足的開發和測試工具。
僅僅編寫了2個控制器，並且寫了它們對應的視圖。
1.1 angular-seed優點
- 提供一個基本的SPA應用的基本框架
- 使用了npm來安裝npm模塊，集成bower安裝第三方類庫和插件
- 集成單元測試和端到端測試環境
- 采用Travis來做集成測試
1.2 angular-seed缺點
- 只創建了2個視圖和對應的控制器
- 未提供創建服務、自定義指令和過濾器的代碼
- 代碼未按需加載，首頁把視圖要用到的控制器代碼全部加載進來
運行效果如下:
單元測試
npm test
End to End測試
npm start
npm run update-webdriver
npm run protractor
在項目不是很復雜的情況，Angular Seed提供框架能滿足實際項目開發，而且本身集成測試，構建和發布一體的環境，適合新手或者項目不復雜的團隊選用。
2.Yeoman生成腳手架項目目錄
Yeoman團隊也提供了一個angular生成器，開發團隊可以通過yo angular生成一個angular項目腳手架，然后基於此腳手架來進行項目開發。
項目目錄結果如下:
運行效果如下:
2.1 yo angular腳手架的優點
- 提供一個基本的SPA應用的基本框架
- 可以通過類似
angular:filter命令創建不同的文件 - 集成了單元測試
- 集成了構建、測試和發布環境
- 添加了樣式文件
2.2 yo angular腳手架的缺點
- 需要了解和使用yeoman，學習成本較高
- 構建工具使用的是Grunt，可能部分團隊更趨向使用
Gulp。
3.小結
目前使用AngularJS進行項目開發的團隊和個人，基本上在項目框架搭建的時候會參考以上2種框架，實際在后期開發過程中，會發現這2個框架會有一些共同問題，比如文件按需加載，框架沒有一開始就很好的支持路由等。所以很多個人或團隊，都會基於這2個框架進行修改，以便更好的支持企業級項目開發。下一篇博客，會寫到公司實際項目框架。