DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML5詳解 >> Grunt 使用說明
Grunt 使用說明
編輯:HTML5詳解     

Gruntjs是一款基於nodeJS的Javascript項目的自動化構建工具。很多知名的開源項目都在使用,如:jquery、yui、qunit、angular.js、CanJS、Modernizr等。

一、安裝nodeJS

nodeJS.org/#download

如果以前全局安裝過grunt 0.3x,執行以下命令

npm uninstall -g grunt

二、安裝grunt-cli

npm install -g grunt-cli

三、安裝templates

//clone the template inside of the ~/.grunt-init/ directory.//http://gruntjs.com/project-scaffolding#installing-templatesgit clone https://github.com/gruntjs/grunt-init-jquery.git ~/.grunt-init/jquerygit clone https://github.com/gruntJS/grunt-init-gruntfile.git ~/.grunt-init/gruntfile

四、已經存在的grunt項目

安裝插件

如果有配置文件package.JSon,執行npm install可以安裝項目依賴的Grunt插件

npm install

或者直接通過官網gruntJS.com/plugins安裝插件

使用

grunt//執行默認命令

五、新建grunt項目

創建項目

mkdir projectgrunt-init template //如grunt-init gruntfile

當前項目下安裝grunt

npm install grunt --save-dev

package.JSon

可以在這個文件中配置項目依賴的Grunt插件

配置Gruntfile

文件名為Gruntfile.JS或Gruntfile.coffee,在這個文件中配置各種構建任務及其加載任務所需要的插件。

安裝插件

如果有配置文件package.JSon,執行npm install可以安裝項目依賴的Grunt插件

npm install

或者直接通過官網gruntJS.com/plugins安裝插件

使用

grunt//執行默認命令,也可以使用

六、前端開發推薦插件

grunt-contrib-clean

npm install grunt-contrib-clean --save-dev

grunt-contrib-concat

npm install grunt-contrib-concat --save-dev

grunt-yui-compressor

npm install grunt-yui-compressor

grunt-contrib-CSSlint

npm install grunt-contrib-CSSlint --save-dev

grunt-contrib-JShint

npm install grunt-contrib-JShint --save-dev

grunt-contrib-qunit

npm install grunt-contrib-qunit --save-dev

grunt-contrib-copy

npm install grunt-contrib-copy --save-dev

grunt-contrib-uglify

npm install grunt-contrib-uglify --save-dev

grunt-imagine npm install grunt-imagine

grunt-contrib-imagemin

npm install grunt-contrib-imagemin --save-dev

grunt-asset-revisions

npm install grunt-asset-revisions

grunt-assets-revving

npm install grunt-assets-revving
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved