gulp 压缩打包css、html和图片

	1、压缩打包css文件

		(1)cnpm install -D gulp-minify-css

		(2)在gulpfile.js文件中引入
			var css自定义压缩名=require("gulp-minify-css")

		(3)创建任务

			gulp.task('自定义任务名',function(cb)
			{
				gulp.src("要压缩文件的路径")
				.pipe(css自定义压缩插件名())
				.pipe(gulp.dest("压缩文件的去处"))
				cb();
			})
				压缩打包多个css文件，参考压缩js路径设置

		(4)执行
			gulp 自定义任务名
			

	2、压缩打包html文件

		(1)cnpm install -D gulp-minify-html

		(2)在gulpfile.js文件中引入
			var html自定义压缩名=require("gulp-minify-html")

		(3)创建任务

			gulp.task('自定义任务名',function(cb)
			{
				gulp.src("要压缩文件的路径")
				.pipe(html自定义压缩插件名())
				.pipe(gulp.dest("压缩文件的去处"))
				cb();
			})
				压缩打包多个html文件，参考压缩js路径设置

		(4)执行
			gulp 自定义任务名


	3、图片的压缩打包

		(1)cnpm install -D gulp-imagemin

		(2)在gulpfile.js文件中引入
			var img自定义压缩名=require("gulp-imagemin")

		(3)创建任务

			gulp.task('自定义任务名',function(cb)
			{
				gulp.src("要压缩图片的文件夹路径/*.{png,jpg,gif,ico,jpeg,svg}")
				.pipe(img自定义压缩插件名({
				
						optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
				        progressive: true,    //类型：Boolean 默认：false 无损压缩jpg图片
				        interlaced: true,     //类型：Boolean 默认：false 隔行扫描gif进行渲染
				        multipass: true       //类型：Boolean 默认：false 多次优化svg直到完全优化
				}))
				.pipe(gulp.dest("压缩文件的去处"))
				cb();
			})
				压缩打包多个img文件，参考压缩js路径设置

		(4)执行
			gulp 自定义任务名

代码示例:

gulpfile.js文件

var gulp = require('gulp');
var yasuo=require("gulp-uglify")
var cssUglify=require("gulp-minify-css")
var htmlts=require("gulp-minify-html")
var imgts=require("gulp-imagemin")

//创建压缩js任务
gulp.task('yasuotest',function(cb){
	gulp.src("./src/js/*.js")
	.pipe(yasuo())
	.pipe(gulp.dest("./dist/js"))
	cb();
})

//压缩css任务
gulp.task("cssys",function(cb){
	gulp.src("./src/css/init.css")
	.pipe(cssUglify())
	.pipe(gulp.dest("./dist/css"))
	cb();
})

//压缩html文件
gulp.task("htmlys",function(cb){
	gulp.src("./index.html")
	.pipe(htmlts())
	.pipe(gulp.dest("./dist"))
	cb();
})

//压缩图片
gulp.task("imgys",function(cb){
	gulp.src("./src/imgs/*.{png,jpg,gif,ico,jpeg,svg}")
	.pipe(imgts({
		optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
        progressive: true,    //类型：Boolean 默认：false 无损压缩jpg图片
        interlaced: true,     //类型：Boolean 默认：false 隔行扫描gif进行渲染
        multipass: true       //类型：Boolean 默认：false 多次优化svg直到完全优化

	}))
	.pipe(gulp.dest("./dist/imgs"))
	cb();
})

//压缩默认任务(即gulp直接执行)
gulp.task('default', function(cb) {
// 将你的默认的任务代码放在这
	gulp.start(["yasuotest","cssys","htmlys"])
	cb();
});