//包装函数
module.exports = function(grunt){
//任务配置，所有插件的配置信息
grunt.initConfig({
//获取package.json的信息
pkg: grunt.file.readJSON('package.json'),
//清除目标文件下文件
clean: {
payment: {
src: ['dist','babel']
}
},
//jshint的插件配置信息
jshint:{
build:[/*'Gruntfile.js',*/'src/**/*.js'],
options:{
jshintrc:'.jshintrc' //检测JS代码错误要根据此文件的设置规范进行检测，可以自己修改规则
}
},
//csslint的插件配置信息
csslint:{
build:['src/**/*.css'],
options:{
jshintrc:'.csslintrc' //css文件的检测规则
}
},
//watch的插件配置信息
watch:{
build:{
files:['src/js/*.js','src/css/*.css'],
tasks:['jshint','uglify'],
options:{
spawn:false
}
}
},
//babel把ES6转成ES5
babel: {
options: {
sourceMap: true
},
dist: {
files: [{
expand:true,
cwd:'src/', //源文件位置
src:['js/*.js'], //所有js文件
dest:'babel/' //输出到此目录下
}]
}
},
//复制源文件目录下的所有文件
copy: {
options: {
mangle: true, //混淆变量名
comments: 'false' //false（删除全部注释），some（保留@preserve @license @cc_on等注释）
},
// payment: {
// expand: true,
// cwd: 'babel', //源文件路径
// src: 'js/*.js', //源文件目录下的所有文件
// dest: 'dist/', //目标文件路径，把源文件下的文件复制到该目录下
// flatten: false, //用来指定是否保持文件目录结构 -- 是
// filter: 'isFile'
// },
allother:{
expand: true,
cwd: 'src', //源文件路径
src: [/*'html/**','css/**','images/**','images_app/**',*/'base/**'], //源文件目录下的所有文件
dest: 'dist/', //目标文件路径，把源文件下的文件复制到该目录下
flatten: false, //用来指定是否保持文件目录结构 -- 是
filter: 'isFile'
}
},
//合并插件的配置
concat: {
options: {
banner:'/*! <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n',
stripBanners: false
},
dist: {
src:'babel/js/*.js',
dest: 'dist/js/<%= pkg.name %>.js'
}
},
//uglify插件的配置信息 压缩js
uglify: {
options: {
banner:'/*! <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n',
},
my_target: {
files: [{
expand:true, //如果设为true，就表示下面文件名的占位符（即*号）都要扩展成具体的文件名。
cwd:'babel', //js目录下
src:['js/*.js'], //所有js文件
dest:'dist/' //输出到此目录下
}]
},
},
//压缩CSS
cssmin:{
yasuo:{
options:{
mangle:false
},
expand: true, //如果设为true，就表示下面文件名的占位符（即*号）都要扩展成具体的文件名。
cwd: 'src/',//压缩那个文件夹里的文件
src:'css/*.css',//压缩那个文件
dest:'dist/',//放压缩后文件的文件夹
ext:'.css'//压缩后文件的的名字
}
},
//压缩HTML
htmlmin:{
options: {
removeComments: true, //移除注释
removeCommentsFromCDATA: true,//移除来自字符数据的注释
collapseWhitespace: true,//无用空格
collapseBooleanAttributes: true,//失败的布尔属性
removeAttributeQuotes: true,//移除属性引号 有些属性不可移走引号
removeRedundantAttributes: true,//移除多余的属性
useShortDoctype: true,//使用短的跟元素
removeEmptyAttributes: true,//移除空的属性
removeOptionalTags: true//移除可选附加标签
},
yasuo:{
expand: true, //如果设为true，就表示下面文件名的占位符（即*号）都要扩展成具体的文件名。
cwd: 'src/',
src: ['html/*.html'],
dest: 'dist/'
}
},
//压缩图片
imagemin: {
prod: {
options: {
optimizationLevel: 3, //定义 PNG 图片优化水平
},
files: [
{
expand: true,
cwd: 'src/',
src: ['images/**/*.{png,jpg,jpeg,gif,webp,svg}'],
dest: 'dist/'
}
]
}
},
});
//加载任务插件
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-csslint');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-copy');
// grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-babel');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-contrib-imagemin');
//告诉grunt当我们在终端中输入grunt时需要做些什么（注意先后顺序）
grunt.registerTask('default',['clean','babel'/*,'concat'*/,'uglify','cssmin','htmlmin','imagemin','copy','watch']);
};
注：
用npm安装css html image 等插件命令：
npm install --save-dev grunt-contrib-cssmin grunt-contrib-htmlmin grunt-contrib-imagemin grunt-contrib-concat grunt-contrib-jshint grunt-contrib-uglify grunt-contrib-watch grunt-contrib-connect
