Fork me on GitHub

使用 Gulp 压缩 Hexo

只压缩hexo g生成的public文件夹下的要发布到 Github Page 的源码。

首先全局安装 Gulp

1
npm i gulp -g

到项目根目录本地安装:

1
npm i gulp gulp-htmlclean gulp-htmlmin gulp-imagemin gulp-minify-css gulp-uglify --save-dev

gulp -v查看版本。
注意:本文用的是gulp 4 (4.0.2),安装时注意有没有版本冲突。

项目根目录新建gulpfile.js,添加如下内容:

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
43
44
45
46
47
48
49
50
51
52
var gulp = require('gulp');
var htmlclean = require('gulp-htmlclean');
var htmlmin = require('gulp-htmlmin');
var cleanCSS = require('gulp-clean-css');
var uglify = require('gulp-uglify');
var imagemin = require('gulp-imagemin')

// 压缩 public 目录 html
gulp.task('minify-html', function() {
return gulp.src('./public/**/*.html')
.pipe(htmlclean())
.pipe(htmlmin({
removeComments: true, //清除HTML注释
collapseWhitespace: true, //压缩HTML
collapseBooleanAttributes: true, //省略布尔属性的值 <input checked="true"/> ==> <input checked />
removeEmptyAttributes: true, //删除所有空格作属性值 <input id="" /> ==> <input />
removeScriptTypeAttributes: true, //删除<script>的type="text/javascript"
removeStyleLinkTypeAttributes: true, //删除<style>和<link>的type="text/css"
minifyJS: true, //压缩页面JS
minifyCSS: true //压缩页面CSS
}))
.on('error', function(err) {
console.log('html Error!', err.message);
this.end();
})
.pipe(gulp.dest('./public'))
});

// 压缩 public 目录 css
gulp.task('minify-css', function() {
return gulp.src('./public/**/*.css')
.pipe(cleanCSS())
.pipe(gulp.dest('./public'));
});

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

// 压缩图片
gulp.task('images', function () {
return gulp.src('./photos/*.*')
.pipe(imagemin({
progressive: true
}))
.pipe(gulp.dest('dist/images'))
});

gulp.task('build', gulp.series('minify-html', 'minify-css', 'minify-js', 'images'));

终端执行gulp build就会执行gulp.task('build', ['minify-html', 'minify-css', 'minify-js', 'images']);任务,即分别压缩public下的html、css、js和图片
之后每次发布前先执行gulp build,再执行hexo deploy,这样提交上线的是压缩后的public下的代码。