我正在用gulp将我的pug文件编译为HTML。每次进行任何类型的更改平均需要30秒!可能是由于我的gulp配置(下面列出)中的某些内容引起的吗?
var gulp = require('gulp')
var pug = require('gulp-pug')
gulp.task('pug', function () {
return gulp.src('pug/**/*.pug')
.pipe(pug({pretty:true, doctype:'HTML'}))
.pipe(gulp.dest('views'))
})
gulp.task('watch:pug', ['pug'], function () {
gulp.watch('pug/**/*.pug', ['pug'])
})
最佳答案
如果是pug
编译使您减速,请添加缓存。
var gulp = require('gulp');
var pug = require('gulp-pug');
var cached = require('gulp-cached');
var remember = require('gulp-remember');
gulp.task('pug', function () {
return gulp.src('pug/**/*.pug', { since: gulp.lastRun('pug') }))
.pipe(cached('pug'))
.pipe(pug({pretty:true, doctype:'HTML'}))
.pipe(remember('pug'))
.pipe(gulp.dest('views'))
})
gulp.task('watch', function(done) {
gulp.watch('pug/**/*.pug', gulp.parallel('pug'));
return done();
});
gulp.task('default', gulp.series('pug', 'watch'));
选项
gulp.lastRun
将仅返回自上次运行给定任务以来已更改的文件。如果使用default
任务来构建文件,则pug
仅需要处理已更改的文件。由于gulp进程通过watch函数保持活动状态,因此它能够缓存所有以前未更改的文件。备注:仅当您使用Gulp v4时,此方法才有效;否则,您应该真正升级;)
Gulp
有一个名为
gulp-cache
的软件包,该软件包为{ since: gulp.lastRun('pug') }
。因此,您应该可以调整代码段:var gulp = require('gulp');
var pug = require('gulp-pug');
var cache = require('gulp-cache');
var cached = require('gulp-cached');
var remember = require('gulp-remember');
gulp.task('pug', function () {
return gulp.src('pug/**/*.pug'))
.pipe(cache('pug'))
.pipe(cached('pug'))
.pipe(pug({pretty:true, doctype:'HTML'}))
.pipe(remember('pug'))
.pipe(gulp.dest('views'))
})
gulp.task('watch', function(done) {
gulp.watch('pug/**/*.pug', ['pug']);
return done();
});
gulp.task('default', ['pug', 'watch']);
我不确定您是否真的需要
gulp-cached
和gulp-remember
。这些软件包将输入文件链接到转换后的输出文件。这意味着gulp-remember
将输出所有已处理的文件。如果文件未更新,则将输出缓存的版本。如果您不需要所有文件(例如,因为没有串联它们),则可以删除这些行。即使软件包名称非常相似,它们也完全不同:
软件包
gulp-cache
将仅转发自上次构建以来已更改的文件。本质上是一样的,然后是选项{ sine: gulp.lastRun('pug') }
。因此,如果需要在管道中进一步处理文件,则需要所有3个软件包,否则,软件包
gulp-cache
(不带d)应该足够。