Question

我正在使用Jekyll + Gulp的构建环境。因此，使用下面的gulpfile.js，构建过程首先生成一个dist/css文件夹，其中包含已编译的css，然后清除整个dist文件夹以将jekyll build结果放入其中。所以，我无法在dist文件夹中编译scss文件，因为每次jekyll它都完全清除它。

var gulp        = require('gulp');
var browserSync = require('browser-sync');
var sass        = require('gulp-sass');
var child       = require('child_process');


gulp.task('jekyll', function (done) {
    return child.spawn('jekyll' , ['build']).on('close', done);
});

gulp.task('jekyll-rebuild', ['jekyll'], function () {
    browserSync.reload();
});

gulp.task('browser-sync', ['sass', 'jekyll'], function() {
    browserSync({
        server: {
            baseDir: 'dist'
        }
    });
});

gulp.task('sass', function () {
    return gulp.src('src/_sass/theme.scss')
        .pipe(sass({
            includePaths: ['scss'],
            onError: browserSync.notify
        }))
        .pipe(browserSync.reload({stream:true}))
        .pipe(gulp.dest('dist/css'));
});

gulp.task('watch', function () {
    gulp.watch('src/_sass/*.scss', ['sass']);
    gulp.watch(['src/*.html', 'src/_layouts/*.html', 'src/_includes/*'], ['jekyll-rebuild']);
});

gulp.task('default', ['browser-sync', 'watch']);

Answer 1

我必须避免与jekyll和styles并行运行scripts任务，因此我使用了runSequence。

gulp.task('build', () => {
    runSequence('jekyll', ['styles', 'scripts']);
});

gulp.task('default', ['build', 'browser-sync', 'watch']);

Answer 2

在您的Jekyll配置中，您需要声明要保留的文件夹：

keep_files: [ css, build ]

在破坏网站目标时，请保留所选文件。对于jekyll不生成的文件很有用;例如由构建工具生成的文件或资产。路径相对于目的地。

https://jekyllrb.com/docs/configuration/

Jekyll使用Gulp清除构建文件夹

2 个答案: