Yeoman安裝和使用詳解
一什么是Yeoman
Yeoman幫助我們創建項目,提供更好的工具來使我們的項目更多樣化。
Yeoman提供generator系統,一個generator是一個插件,在我們在一個完整的項目上使用‘yo’命令時,會運行該generator。通過這些官方的Generators,推出了Yeoman工作流,工作流是一個健壯、有自己特色的客戶端堆棧,包含能快速構建漂亮的網絡應用的工具和框架。Yeoman提供了負責開始項目開發的一切,沒有任何讓人頭痛的手動配置。
采用模塊化結構,Yeoman利用從幾個開源社區網站學習到的成功和教訓,以確保棧開發人員越來越智能的進行開發。基於良好的文檔基礎以及深思熟慮的項目構建過程,Yeoman提供測試和其他更多技術,因此開發人員可以更專注於解決方案而不用去擔心其他小事。
Yeoman主要提供了三個工具:腳手架(yo),構建工具(grunt),包管理器(bower)。這三個工具是分別獨立開發的,但是需要配合使用,來實現我們更高效的工作流模式。
二 Yeoman安裝步驟
系統環境:win8
1.Node.js安裝
到Node.js官方網址下載Node.js
安裝后驗證是否安裝成功:進入命令提示符,輸入node --verison命令
安裝Node.js,會自動安裝npm,驗證npm是否安裝成功:同樣在命令提示符中輸入npm --version
2.安裝git
Git 是 Linus Torvalds 為了幫助管理 Linux 內核開發而開發的一個開放源碼的版本控制軟件。Yeoman自動構建項目時會用到該軟件,所以我們先安裝好。到Git官網上下載並安裝
選擇第二項
3.安裝Yeoman
在命令提示符中運行npm install -g yo grunt-cli bower
經過幾屏的安裝信息滾動,最后你會看到安裝成功提示:
4.安裝generator
在命令提示符中輸入yo命令
用上下鍵選擇install a generator,我們選擇安裝webapp generator,輸入webapp,選擇webapp
接下來我們使用yeoman創建項目
5.Yeoman使用
創建一個工作目錄,用於存放Yeoman項目。我在D盤下新建AngularJs的webapp工作目錄,終端進入,輸入yo命令,用上下鍵選擇webapp
這里我們不選擇Sass,因為需要Sass的話運行環境是Ruby,在windows下配置會非常麻煩;選擇bootstrap;不選擇Modernizr;點擊回車,經過幾屏的信息滾動后,會提示項目構建完成,文件目錄如下:
app文件夾內目錄:
6.在瀏覽器中預覽
在命令提示符中輸入:grunt server
啟動成功
如果啟動過程中,服務器報錯,可以使用強制啟動,命令為grunt server -force
服務器啟動后,瀏覽器會自動打開並訪問:http://localhost:9000/,如下圖所示:
至此,Yeoman安裝和使用講解完畢