Javascript 缓慢的pug编译为HTML

我正在使用gulp将我的pug文件编译成HTML。每次我做任何改变平均需要30秒！这可能是由于我的吞咽配置（如下所列）中的某些内容造成的吗

---

如果是

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时有效，如果不使用，您应该真正升级；）

吞咽<4.0的溶液 有一个名为的包，它

{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']);

我不确定您是否真的需要

gulpcached

和

gulpmemory

。这些包将输入文件链接到转换后的输出文件。这意味着

gulp memory

将输出所有已处理的文件。如果文件未更新，它将输出缓存的版本。如果您不需要所有文件（例如，因为您没有连接它们），您可以删除这些行

即使包名称非常相似，它们也完全不同：

包

gulp cache

将只转发自上次生成以来已更改的文件。它基本上也是这样做的，然后选择

{sine:gulp.lastRun（'pug'）}

---

因此，如果您需要进一步处理管道中的文件，则需要所有3个包，否则，包

gulp cache

（没有d）就足够了。

如果是

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时有效，如果不使用，您应该真正升级；）

吞咽<4.0的溶液 有一个名为的包，它

{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']);

我不确定您是否真的需要

gulpcached

和

gulpmemory

。这些包将输入文件链接到转换后的输出文件。这意味着

gulp memory

将输出所有已处理的文件。如果文件未更新，它将输出缓存的版本。如果您不需要所有文件（例如，因为您没有连接它们），您可以删除这些行

即使包名称非常相似，它们也完全不同：

包

gulp cache

将只转发自上次生成以来已更改的文件。它基本上也是这样做的，然后选择

{sine:gulp.lastRun（'pug'）}

因此，如果您需要在管道中进一步处理文件，则需要所有3个包，否则，包

gulp cache

（不带d）应该足够了。

I使用此选项

仅传递更改的文件

不再在处理未更改的文件上浪费宝贵的时间

我正在使用这个

仅传递更改的文件

不再在处理未更改的文件上浪费宝贵的时间

---

这能解决您的问题吗？这能解决您的问题吗？这似乎是个好主意，但不幸的是，我目前无法将Gulp升级到v4。v3.9中是否没有此任务？@RomainGaget我已更新了答案。但是这个解决方案还没有经过测试。太棒了，它实际上是通过添加缓存和记忆来工作的。编译时间从40秒增加到了3秒！！谢谢@IqonGreat！在这种情况下，我将删除未测试的标记。此方法是否更新依赖于已修改文件的pug文件？我以前尝试过gulp cache，但它只解析了修改后的文件，没有更改导入它们的文件，这一点都没有帮助。这似乎是个好主意，但不幸的是，我目前无法将gulp升级到v4。v3.9中没有此任务吗？@RomainGaget我已更新了答案。但是这个解决方案还没有经过测试。太棒了，它实际上是通过添加缓存和记忆来工作的。编译时间从40秒增加到了3秒！！谢谢@IqonGreat！在这种情况下，我将删除未测试的标记。此方法是否更新依赖于已修改文件的pug文件？我曾经尝试过gulp cache，它只解析了修改过的文件，没有更改导入它们的文件，这一点都没有帮助。