Node.js+Express+Grunt+Bower+RequireJS項目搭建時的常用命令

標籤：style   blog   http   io   color   ar   os   使用   sp   

1.Node.js（開發環境）

　　在nodejs.org下載並安裝node.js

　　node -v　　//查看node.js版本

　　npm -v　　//查看npm(node的包管理器)版本

　　npm init　　//引導建立依賴包資訊管理檔案“package.json”

　　node --debug-brk app.js　　//偵錯模式

　　node -inspector　　//開啟檢查

2.Express（Web應用程式框架）

　　npm install -g express　　//安裝express

　　npm install -g express-generator　　//安裝express的命令列工具

　　npm update -g [name]　　//更新包

　　express -V　　//查看express版本

　　express [APP_name]　　//建立項目

　　調整專案檔目錄

　　cd [APP_name] && npm install　　//進入項目目錄並檢測“package.json”檔案安裝所有依賴包

　　npm install nodemon --save　　//安裝nodemon並寫入“package.json”檔案

　　修改“package.json”檔案中start的命令為nodemon並根據調整後的目錄更改路徑

　　npm start //啟動服務

　　開啟瀏覽器，輸入 localhost:3000 查看

3.Grunt（任務管理）

　　增加待編譯檔案目錄

　　npm install -g grunt-cli　　//安裝grunt的命令列工具

　　npm install grunt --save-dev　　//安裝grunt並寫入“package.json”檔案

　　grunt -V　　//查看grunt版本

　　備忘：grunt相關的依賴包都使用 --save-dev

4.Bower（前端依賴管理）

　　npm install -g bower　　//安裝bower

　　bower -v　　//查看bower版本

　　bower init　　//引導建立依賴包資訊管理檔案“bower.json”

　　建立.bowerrc檔案，輸入內容：

　　　　{"directory": "public/libs"}　　//設定依賴包下載目錄

　　bower search [name]　　//搜尋包

　　bower install [name] --save　　//安裝包並寫入“bower.json”檔案中

　　bower install [name] --save-dev　　//只用於開發中

　　bower update [name] --save　　//更新包

　　bower uninstall [name] --save　　//移除包

　　bower install　　//檢測“bower.json”檔案安裝所有依賴包

5.RequireJS（JS載入管理）

　　建立config.js檔案用於配置依賴包路徑，內容格式：

 1 require.config({ 2     baseUrl: ‘src‘, 3     paths: { 4         jquery: ‘src‘, 5         bootstrap: ‘src‘ 6     }, 7     shim: { 8         bootstrap: [‘jquery‘] 9     }10 });

　　視圖檔案下方引入：

<script src="requirejs path", data-main="pagejs path"></script>

　　頁面js檔案中頭部：

require([‘./conifg‘], function(config) {    require([‘jquery‘, ‘bootstrap‘], function($) {        // this is your code    });    });

 

Node.js+Express+Grunt+Bower+RequireJS項目搭建時的常用命令