Question

到目前为止，我已经在多个项目中使用了Gulp设置，但是此实例失败了。

我正在创建一个jekyll网站，但是由于jekyll的CSS生成管道无法满足我的需求，因此我切换到Gulp，并设置了一个监视任务，该任务负责更改_site/assets/style.css文件。

这是代码：

const gulp = require('gulp');
const purgecss = require('gulp-purgecss');
const postcss = require('gulp-postcss');
const rename = require('gulp-rename');
const { watch } = require('gulp');

gulp.task('build:css', () => 
    gulp.src('_site/assets/style.css')
        .pipe(postcss([
            require('tailwindcss')('tailwind.js')
        ]))
        .pipe(purgecss({
            content: ['_site/**/*.html']
        }))
        // TODO: add minification
        .pipe(rename('style.min.css'))
        .pipe(gulp.dest('_site/assets/'))
);

gulp.task('watch', () => {
    const watcher = watch('_site/assets/style.css');
    watcher.on('change', function(path, stats) {
        console.log(`File ${path} was changed`);
    });

    watcher.on('add', function(path, stats) {
        console.log(`File ${path} was added`);
    });

    watcher.on('unlink', function(path, stats) {
        console.log(`File ${path} was removed`);
    });
    //gulp.watch('_site/assets/style.css', gulp.parallel('build:css'))
});

控制台输出如下：

myName@my-pc:/mnt/c/...$ echo "Before debug code addition"
Before debug code addition

myName@my-pc:/mnt/c/...$ npm test

> gulp watch --gulpfile gulpfile

[18:29:38] Using gulpfile /mnt/c/.../gulpfile
[18:29:38] Starting 'watch'...
[18:29:46] Starting 'build:css'...
[18:29:48] Finished 'build:css' after 1.99 s
^C
myName@my-pc:/mnt/c/...$ echo "After debug code addition"
After debug code addition

myName@my-pc:/mnt/c/...$ npm test

> gulp watch --gulpfile gulpfile

[18:32:59] Using gulpfile /mnt/c/.../gulpfile
[18:32:59] Starting 'watch'...
File _site/assets/style.css was changed

除了第一个change事件外，观察者不会触发任何事件。不管我用jekyll生成相同文件（内容不同）多少次，因为Gulp不在乎。

Gulp / w Jekyll-观看回调仅运行一次

0 个答案: