grunt合并压缩js,css文件(第二弹)
废话不多说,直接上图:
目录结构,你懂得
package.json文件:
{
"name": "anme",
"file": "filename",
"version": "0.1.0",
"description": "description",
"license": "MIT",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-jshint": "~0.6.3",
"grunt-contrib-uglify": "~0.2.1",
"grunt-contrib-concat": "~0.5.1",
"grunt-contrib-cssmin": "~0.12.3"
},
"dependencies": {
"express": "3.x"
}
}
css的压缩合并Gruntfile.js文件(灵活调用即可):
module.exports = function (grunt) {
// 项目配置
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat : {
css : {
src: ['src/*.css'],
dest:'dest/all.css'
}
},
cssmin: {
buildall: {//按原文件结构压缩css文件夹内所有JS文件
files: [{
expand:true,
cwd:'src',//src目录下
src:'**/*.css',//所有css文件
dest: 'dest'//输出到此目录下
}]
}
}
});
// 加载提供"uglify"任务的插件
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-cssmin');
// 默认任务
grunt.registerTask('default', ['cssmin']);
//grunt.registerTask('default', ['uglify']);
//grunt.registerTask('default', ['concat']);
}
js的压缩合并Gruntfile.js文件(灵活调用即可):
module.exports = function (grunt) {
// 项目配置
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
banner: '/* <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
buildall: {//按原文件结构压缩js文件夹内所有JS文件
files: [{
expand:true,
cwd:'src',//src目录下
src:'**/*.js',//所有js文件
dest: 'dest'//输出到此目录下
}]
}
},
concat: {
options: {
separator: ';'
},
dist: {
//src: ['src/index.js', 'src/main.js', 'src/style.js'],
src: ['src/*.js'],
dest: 'dest/all.js'
}
},
});
// 加载提供"uglify"任务的插件
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-cssmin');
// 默认任务
//grunt.registerTask('default', ['cssmin']);//压缩样式
//grunt.registerTask('default', ['uglify']);//压缩脚本
grunt.registerTask('default', ['concat']);//合并脚本
}
建议:多动手,多尝试,你会懂的!