經常使用gulp文件

var gulp         = require('gulp'),
    jshint       = require('gulp-jshint'),
    sass         = require('gulp-sass'),
    concat       = require('gulp-concat'),
    uglify       = require('gulp-uglify'),
    rename       = require('gulp-rename'),
    imagemin     = require('gulp-imagemin'),
    minifycss    = require('gulp-minify-css'),
    livereload   = require('gulp-livereload'),
    connect      = require('gulp-connect');
 
//檢查腳本
gulp.task('lint', function(){
    gulp.src('./src/js/*.js')
        .pipe(jshint())
        .pipe(jshint.reporter('default'));
});

//編譯sass
gulp.task('sass', function(){
    gulp.src('./src/sass/*.scss')
        .pipe(sass())
        .pipe(gulp.dest('./dist/css'));
});

//合併,壓縮js
gulp.task('scripts', function(){
    gulp.src('./src/js/*.js')
        // .pipe(concat('all.js'))
        .pipe(gulp.dest('./dist/js'))
        // .pipe(rename('all.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('./dist/js'))
        .pipe(connect.reload());
});

//壓縮圖片
gulp.task('imagesmin', function(){
    gulp.src('./src/images/*.{png,jpg,gif,ico}')
        .pipe(imagemin({
            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/images'))
});

//監聽html
gulp.task('html', function () {
      gulp.src('./src/*.html')
          .pipe(gulp.dest('./dist'))
        .pipe(connect.reload());
});

//壓縮,合併css
gulp.task('css', function() {
    gulp.src('src/css/*.css')
        // .pipe(concat('main.css'))
        // .pipe(gulp.dest('./dist/css'))
        .pipe(rename({ suffix: '.min' }))
        .pipe(minifycss())
        .pipe(gulp.dest('./dist/css'))
        .pipe(connect.reload());
});

//監聽
gulp.task('watch', function(){
    gulp.watch('./src/js/*.js', ['lint', 'scripts']);
    gulp.watch('./src/css/*.css', ['css']);
    gulp.watch('./src/*.html', ['html'])
});

//server
gulp.task('connect', function () {
  connect.server({
    root: './dist',
    livereload: true
  });
});

//整理其餘任務
gulp.task('release', ['html', 'lint','scripts','sass','css','imagesmin']);

//默認任務
gulp.task('default', ['release', 'connect', 'watch']);
相關文章
相關標籤/搜索