1. Intor

“Builds can be the most awful sinkhole for teams to waste their time with - gulp is a serious win for any project.”
Eric, Co-founder @ stae

  1. Get ready

    • Install gulp

      1
      npm install gulp
    • Install plugins

      • gulp-minify-css
      • gulp-uglify
      • gulp-htmlmin
      • gulp-htmlclean
        1
        npm install gulp-minify-css

      ETC…

  2. Configuration
    Write your own gulpfile.js & put it in your root dir

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    var debug = true
    var gulp = require('gulp');
    var minifycss = require('gulp-minify-css');
    var uglify = require('gulp-uglify');
    var htmlmin = require('gulp-htmlmin');
    var htmlclean = require('gulp-htmlclean');

    // 压缩 public 目录 css文件

    gulp.task('minify-css', function() {
    return gulp.src('./public/css/*.css')
    .pipe(minifycss())
    .pipe(gulp.dest('./public'));
    });

    // 压缩 public 目录 html文件

    gulp.task('minify-html', function() {
    return gulp.src('./public/**/*.html')
    .pipe(htmlclean())
    .pipe(htmlmin({
    removeComments: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true,
    }))
    .pipe(gulp.dest('./public'))
    });

    // 压缩 public/js 目录 js文件

    gulp.task('minify-js', function() {
    return gulp.src('./public/js/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('./public'));
    });

    // 执行 gulp 命令时执行的任务

    gulp.task('hexo', [
    'minify-html','minify-css'
    ]);
  3. Deploy

1
2
3
4
hexo clean
hexo g
gulp hexo
hexo deply

Done.
EOF.