gulp是基于Node.js的自动任务运行器,能自动化地完成 JavaScript/sass/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成,同时可以对文件进行监听,如果文件有改动,可以自动处理生成新的文件。
gulp 和 grunt 非常类似,grunt 会频繁进行 IO 操作,而 gulp 则不需要,可以更高效的完成操作。
Gulp官网地址: https://gulpjs.com/
安装起来非常简单,首先确保安装成功了 node.js, 然后:
npm install gulp-cli -g npm install gulp -D touch gulpfile.js
gulpfile是核心文件,需要进行配置,下面是 gulpfile.js 的示例内容:
1 var gulp = require(‘gulp‘); 2 var pug = require(‘gulp-pug‘); 3 var less = require(‘gulp-less‘); 4 var minifyCSS = require(‘gulp-csso‘); 5 6 gulp.task(‘html‘, function(){ 7 return gulp.src(‘client/templates/*.pug‘) 8 .pipe(pug()) 9 .pipe(gulp.dest(‘build/html‘)) 10 }); 11 12 gulp.task(‘css‘, function(){ 13 return gulp.src(‘client/templates/*.less‘) 14 .pipe(less()) 15 .pipe(minifyCSS()) 16 .pipe(gulp.dest(‘build/css‘)) 17 }); 18 19 gulp.task(‘default‘, [ ‘html‘, ‘css‘ ]);
gulp 本身有众多实用的插件,比如想编译sass 到 css 就需要 gulp-ruby-sass 插件。
时间: 2024-10-02 07:16:51