使用yeoman快速搭建基於angularjs的js項目

Yeoman介紹

Yeoman是Google的團隊和外部貢獻者團隊合做開發的，他的目標是經過Grunt（一個用於開發任務自動化的命令行工具）和Bower（一個HTML、CSS、Javascript和圖片等前端資源的包管理器）的包裝爲開發者建立一個易用的工做流。

Yeoman主要有三部分組成：yo（腳手架工具）、grunt（構建工具）、bower（包管理器）。這三個工具是分別獨立開發的，可是須要配合使用，來實現咱們高效的工做流模式。

bower介紹

bower做爲一個js依賴管理的工具，提供一種理想包管理方式，藉助了npm的一些思想，爲咱們提供一個舒服的開發環境。

bower安裝指定的依賴庫

搭建過程

前提已經安裝git、nodejs、npm、vscode（搭建過程當中非必要）

一、全局安裝yeoman環境

npm install -g yo grunt-cli bower

二、檢測是否已經安裝成功（此處我是全局安裝的Grunt，其實應該是全局安裝gurnt-cli，在開發目錄下安裝grunt便可）

npm yo --version && grunt --version && bower --version

 

三、安裝angular生成器 不選擇版本的話默認是angularjs1.x

npm install -g generator-angular

四、建立開發目錄文件夾 使用mkdir或者手動建立均可以 我建立的是test

五、在test文件夾打開命令行輸入：yo

 

六、選擇generator，咱們選擇angular 這時它會去github上下載文件和目錄到test文件夾

七、安裝gruntfile.js文件中需求的全部插件

npm install 默認安裝全部需求的插件

 

八、安裝bower.json文件中的默認的依賴庫

bower install

 

九、生成dist文件夾並運行

grunt serve:dist

十、這樣一個基於angularjs的js項目就搭建完成了。