之所以这篇文章取名为“入门之入门”，因为连入门都算不上，只是暂时了解一下这门技术，并且应用于我的博客的优化中。其实gulp很早之前就有所接触了，这次终于有机会体验一把了

我的gulp学习历程比较奇葩，是首先按教程和自己摸索，使用gulp把网站优化了之后再去看gulp的有关资料的，事实证明gulp的源码非常明了，我从来没接触过的人看一眼也能明白每段代码具体是干什么的。首先还是介绍一下如何使用gulp优化网站吧。

需求

因为我们发现每次deploy都是先将public文件夹下的内容清理干净（事实上，public文件夹就是你上传到github上的最终内容），然后把全部文件编译生成一遍，再次生成public文件夹，再上传，如果博客数一旦变多，这个过程就会很慢且效率底下，我们需要gulp这个工具来压缩代码（这个功能是教程里提供的，事实上gulp能做的远不止这么些）

实现过程

安装gulp

在博客的根目录，执行以下命令

1
2
3

$ npm install gulp -g
$ npm install gulp-minify-css gulp-uglify gulp-htmlmin gulp-htmlclean gulp --save
$ npm install gulp-babel

这里的gulp-babel是我后来自己加的，原教程没有加，但是在之后的deploy会出错

新建配置文件

在博客的根目录下，新建名为gulp.js的文件，文件内容为

var gulp = require('gulp');
var minifycss = require('gulp-minify-css');
var uglify = require('gulp-uglify');
var babel = require('gulp-babel');
var htmlmin = require('gulp-htmlmin');
var htmlclean = require('gulp-htmlclean');
// 压缩 public 目录 css
gulp.task('minify-css', function() {
    return gulp.src('./public/**/*.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')
        .pipe(babel())
        .pipe(uglify())
        .pipe(gulp.dest('./public'));
});
// 执行 gulp 命令时执行的任务
gulp.task('default', [
    'minify-html','minify-css','minify-js'
]);

没有添加babel()环节时，终端会报错说压缩js文件出错，我查了一下，说是es6需要编译，那么还需要引入gulp-babel文件，并且在gulp的pipe里添加一个.pipe(babel())

修改deploy.sh文件

gulp的基本配置已经完成了，我们只需要在生成hexo的public文件时，使用之就可以了，具体操作是，打开deploy.sh文件，将其

hexo g

修改为

1	hexo g & gulp

完成，这样每次运行`deploy.sh脚本时，在生成文件都会提高效率

关于gulp

接下来就是我对gulp的一些了解，看一下一位前端工作者对gulp的描述

Gulp / Grunt 是工具链、构建工具，它们能够优化前端工作流程。比如自动刷新页面、combo、压缩css、js、编译less等等。使用Gulp/Grunt，然后配置你需要的插件，就可以替代手工实现自动化工作。

我自己的理解就是是一个自动化工具，配合各种插件（几千种），能够自定义实现很多流水线工作，尤其是和less或者sass等css预编译语言配合，但是现在还不是我学习这个的最佳时机，因为我暂时平时用到这个的地方很少，等到研究生阶段做项目的时候再深入理解之。

总结

越学习发现需要学习的东西越多，自己掌握的还是太少了。通过这次实践之后，坚定了我学习gulp&less&脚手架工具的决心。此外，我还深切体会到了懒是程序员的第一动力这句话的真谛，要始终明白，程序员的首要工作是创造，而不是重复性工作。感觉好像回到了学习SICP的时候，当时被书里抽象了又抽象的思想震撼到了。唉，要不是被考研束缚住了，我现在就想每天抱着笔记本再买些书天天泡前端…（bu cun zai de）