npm文档：www.npmjs.com
grunt基础教程：http://www.gruntjs.net/docs/getting-started/
http://www.w3cplus.com/tools/grunt-tutorial-start-grunt.html
http://www.w3cplus.com/tools/grunt-tutorial-installing-grunt.html
package配置文件
http://blog.csdn.net/woxueliuyun/article/details/39294375
npm install grunt@0.4.5 --save-dev//安装grunt
npm install -g grunt-cli//全局执行cli
npm install
grunt --version//检测
grunt执行子任务：
grunt.initConfig({
concat: {
js:{},
css:{}
}
})
以上代码，只执行合并css，可以 grunt concat:css
一、需求
1.执行grunt——默认合并压缩js和css
2.执行grunt js——合并压缩js
3.执行grunt css——合并压缩css
二、依赖插件
1.js压缩：uglify https://github.com/gruntjs/grunt-contrib-uglify
三、代码
[GruntFile.js]
module.exports = function(grunt) {
grunt.initConfig({
timestamp:'<%= grunt.template.today("yyyymmddHHMM") %>',
jspath:'app/js/',
csspath:'app/css/',
concat: {
js:{
options: {
separator: ';'
},
src: [
"<%= jspath %>template.js",
"<%= jspath %>returnCode.js",
],
dest: '<%= jspath %>all.<%= timestamp %>.js'
},
css:{
src: [
'<%= csspath %>manage.css',
'<%= csspath %>jqpagination.css'
],
dest: '<%= csspath %>all.<%= timestamp %>.css'
}
},
uglify: {
options: {
banner: '/*! <%= concat.js.dest %> */\n'
},
dist: {
files: {
'<%= jspath %>all.min.<%= timestamp %>.js': ['<%= concat.js.dest %>']
}
}
},
cssmin: {
minify: {
expand: true,
cwd: '<%= csspath %>',
src: 'all.<%= timestamp %>.css',
dest: '<%= csspath %>',
ext: '.min.<%= timestamp %>.css'
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
//自定义任务
grunt.registerTask('default', ['concat','uglify','cssmin']);//默认
grunt.registerTask('js', ['concat:js','uglify']);
grunt.registerTask('css', ['concat:css','cssmin']);
};
[pakeage.json]
{
"name": "test",
"author": "youryida",
"devDependencies": {
"grunt": "^0.4.5",
"grunt-contrib-concat": "^0.4.0",
"grunt-contrib-uglify": "^0.4.0",
"grunt-contrib-cssmin": "latest"
}
}