javascript - Gulp.js 不会重新加载纯 CSS

Question

这是我的 Gulpfile:

var gulp         = require('gulp'),
    watch        = require('gulp-watch'),
    livereload   = require('gulp-livereload');


gulp.task('watch', function() {
    livereload.listen();

    gulp.watch('./css/**/*.css', ['css']).on('change', livereload.changed);
    gulp.watch('./js/**/*.js', ['js']).on('change', livereload.changed);
    gulp.watch('./**/*.php').on('change', livereload.changed);
});

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

它会重新加载 CSS 一次，然后会因以下错误而崩溃:

[15:30:13] style.css was reloaded.
[15:30:13] Task 'css' is not in your gulpfile
[15:30:13] Please check the documentation for proper gulpfile formatting

不知道这是怎么回事，有人遇到过类似的问题吗？

Answer 1

首先，您需要创建一个任务，其中包含您想使用此 CSS 执行的操作

gulp.task('css', function() {
    return gulp.src('./css/**/*.css')
           .pipe(livereload());
});

然后观察这个文件，如果改变了，再次运行任务。

gulp.task('watch', function() {
    livereload.listen();

    gulp.watch('./css/**/*.css', ['css']);
});

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