码迷,mamicode.com
首页 > 其他好文 > 详细

gulp优化hexo方法

时间:2019-03-29 19:27:30      阅读:241      评论:0      收藏:0      [点我收藏+]

标签:css   com   博客   require   evel   优化   optipng   strong   src   

gulp通过对站点使用的静态资源进行压缩,来优化网站的访问速度。

 

首先安装gulp以及所需要的模块:

npm install gulp -g

 

npm install gulp-htmlclean gulp-htmlmin gulp-minify-css gulp-uglify gulp-imagemin --save

 

然后在博客的根目录下创建gulpfile.js文件写入代码:

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);
var imagemin = require(gulp-imagemin);

// 压缩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))
});
// 压缩css
gulp.task(minify-css, function() {
    return gulp.src(./public/**/*.css)
        .pipe(minifycss({
            compatibility: ie8
        }))
        .pipe(gulp.dest(./public));
});
// 压缩js
gulp.task(minify-js, function() {
    return gulp.src(./public/js/**/*.js)
        .pipe(uglify())
        .pipe(gulp.dest(./public));
});
// 压缩图片
gulp.task(minify-images, function() {
    return gulp.src(./public/images/**/*.*)
        .pipe(imagemin(
        [imagemin.gifsicle({optimizationLevel: 3}),
        imagemin.jpegtran({progressive: true}),
        imagemin.optipng({optimizationLevel: 7}),
        imagemin.svgo()],
        {verbose: true}))
        .pipe(gulp.dest(./public/images))
});
// 默认任务
gulp.task(default, gulp.parallel(
    minify-html,minify-css,minify-js,minify-images
));

 

最后执行命令,上传GitHub

hexo clean&&hexo g&&gulp&&hexo d

gulp优化hexo方法

标签:css   com   博客   require   evel   优化   optipng   strong   src   

原文地址:https://www.cnblogs.com/Mayfly-nymph/p/10623234.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!