Home | 簡體中文 | 繁體中文 | 雜文 | 打賞(Donations) | ITEYE 博客 | OSChina 博客 | Facebook | Linkedin | 知乎專欄 | Search | Email

4.16. Example

4.16.1. HTML,JS,CSS

			
var gulp = require('gulp');
var minifyHtml = require("gulp-minify-html");
var minifycss = require('gulp-clean-css');
//var minifycss = require("gulp-minify-css");
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var path = require("path");
var glob = require("glob");
var watch = require('gulp-watch');

gulp.task('minify-html', function () {
    gulp.src('./*.html')
    .pipe(minifyHtml())
    .pipe(gulp.dest('build/'));
});

gulp.task('minify-css', function () {

	gulp.src('./css/*.css')
	.pipe(concat("finally.css"))
	.pipe(rename({ suffix: '.min' }))
	.pipe(minifycss())
	.pipe(gulp.dest('build/css'));

});

gulp.task('minify-js', function(){

	gulp.src(__dirname + "/js/*.js")
	.pipe(concat("finally.js"))
        .pipe(rename({ suffix: '.min' }))
	.pipe(uglify())
	.pipe(gulp.dest('build/js'))

});

gulp.task('default',function() {
    gulp.start('minify-css','minify-js');
});

gulp.task('watch', function() {
    watch(__dirname + "/css/**/*.css", function() {
        gulp.run('minify-css');
    });
    watch(__dirname + "/js/**/*.js", function() {
        gulp.run('minify-js');
    });
});
			
			

4.16.2. 命令行傳遞參數

			
			
			
var gulp = require('gulp');
var argv = require('yargs').argv;
//var minifyHtml = require("gulp-minify-html");
var minifycss = require('gulp-clean-css');
//var minifycss = require("gulp-minify-css");
var spriter = require("gulp-spriter");
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var path = require("path");
var glob = require("glob");
var watch = require('gulp-watch');

//var src = __dirname + "/" + argv.stage + "/build/" + argv.src;
//var dest = __dirname + "/" + argv.stage + "/build/" + argv.src;
var src = __dirname + "/" + argv.src;
var dest = __dirname + "/dist/" + argv.src;
console.log(src);

gulp.task('minify-html', function () {
    gulp.src( src +'/*.html') // path to your files
    .pipe(minifyHtml())
    .pipe(gulp.dest( dest + '/'));
});

gulp.task('minify-css', function () {

	gulp.src(src + '/css/**/*.css')
	.pipe(concat("finally.css"))
	.pipe(rename({ suffix: '.min' }))
	.pipe(minifycss())
	.pipe(gulp.dest(dest + '/css'));

});

gulp.task('minify-js', function(){

	gulp.src(src + "/js/**/*.js")
	.pipe(concat("finally.js"))
        .pipe(rename({ suffix: '.min' }))
	.pipe(uglify())
	.pipe(gulp.dest( dest + '/js'))

});

gulp.task("spriter",["clean"],function(){
  return gulp.src( dest + "/css/finally.min.css")
         .pipe(spriter({
            sprite:"finally.png",
            slice: src + "/images",
            outpath: dest + "/images"
          }))
         .pipe(gulp.dest( dest + '/images'))
})


gulp.task('default',function() {
    gulp.start('minify-css','minify-js');
});

gulp.task('watch', function() {
    watch(src + "/css/**/*.css", function() {
        gulp.run('minify-css');
    });
    watch(src + "/js/**/*.js", function() {
        gulp.run('minify-js');
    });
});