GULP组装&吞掉-观看时改变对数据所作不重新编译的网站,包括或布局(gulp-assemble &

2019-09-29 16:48发布

我在使用问题gulp-assemblegulp-watch 。 我想gulp观看整个组装源目录( dataincludeslayoutspages ),并重新编译网站当过一个文件的更改。

我能够得到这个工作正常的pages ,但gulp时更改了做不重新编译的网站dataincludeslayouts文件。

我添加了一个watch任务的例子gulpfile.js在gulp-assemble库:

var gulp = require('gulp');
var htmlmin = require('gulp-htmlmin');
var extname = require('gulp-extname');
var assemble = require('assemble');
var middleware = require('./examples/middleware');
var gulpAssemble = require('./');

// setup items on the assemble object
assemble.data({site: {title: 'Blog'}});
assemble.data(['test/fixtures/data/*.{json,yml}']);
assemble.layouts(['test/fixtures/layouts/*.hbs']);
assemble.partials(['test/fixtures/includes/*.hbs']);

// arbitrary middleware that runs when files loaded
assemble.onLoad(/index\.hbs/, middleware(assemble));

// render templates in `test/fixtures`
gulp.task('default', function () {
  gulp.src('test/fixtures/pages/*.hbs')
    .pipe(gulpAssemble(assemble, { layout: 'default' }))
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(extname())
    .pipe(gulp.dest('_gh_pages/'));
});

// ============================================================
// my watch task
// ============================================================
gulp.task('watch', ['default'], function() {
  gulp.watch('test/fixtures/**/*.{hbs,yml,json}', ['default']);
});

如果我运行gulp watch和保存更改任何的.hbs中的文件pages目录,我看到gulp触发default在我的终端输出,我看到.html文件_gh_pages更新与变化。

但是,如果我保存更改任何的.hbs.json.yml文件中的dataincludeslayouts的目录,我看到gulp触发default在我的终端输出,但我看不出有任何更改_gh_pages .html文件(S)。 我必须运行gulp default ,以获得适用于变更手动任务_gh_pages文件。

我需要什么,以获得所需的行为改变?

Answer 1:

吞手表,将只对默认任务的函数中执行代码,所以把事情像数据和布局重新加载,你需要这些代码块移动到函数内(就在gulp.src)。

var gulp = require('gulp');
var htmlmin = require('gulp-htmlmin');
var extname = require('gulp-extname');
var assemble = require('assemble');
var middleware = require('./examples/middleware');
var gulpAssemble = require('./');

// arbitrary middleware that runs when files loaded
assemble.onLoad(/index\.hbs/, middleware(assemble));

// render templates in `test/fixtures`
gulp.task('default', function () {
  // setup items on the assemble object
  assemble.data({site: {title: 'Blog'}});
  assemble.data(['test/fixtures/data/*.{json,yml}']);
  assemble.layouts(['test/fixtures/layouts/*.hbs']);
  assemble.partials(['test/fixtures/includes/*.hbs']);

  gulp.src('test/fixtures/pages/*.hbs')
    .pipe(gulpAssemble(assemble, { layout: 'default' }))
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(extname())
    .pipe(gulp.dest('_gh_pages/'));
});

// ============================================================
// my watch task
// ============================================================
gulp.task('watch', ['default'], function() {
  gulp.watch('test/fixtures/**/*.{hbs,yml,json}', ['default']);
});


文章来源: gulp-assemble & gulp-watch not recompiling site when changes are made to data, includes or layouts