4

我刚刚开始使用Gulp来改进我的工作流程。我目前有一个名为styles编译.less文件的任务和一个名为 的任务watch,用于监视任何.less文件中的更改,然后运行styles任务。我的gulpfile.js包含以下代码:

var gulp = require( 'gulp' ),
        less = require( 'gulp-less' ),
        autoprefixer = require( 'gulp-autoprefixer' ),
        minifycss = require( 'gulp-minify-css' ),
        jshint = require( 'gulp-jshint' ),
        uglify = require( 'gulp-uglify' ),
        imagemin = require( 'gulp-imagemin' ),
        rename = require( 'gulp-rename' ),
        clean = require( 'gulp-clean' ),
        concat = require( 'gulp-concat' ),
        notify = require( 'gulp-notify' ),
        cache = require( 'gulp-cache' ),
        header = require( 'gulp-header' ),
        footer = require( 'gulp-footer' );

// styles task
gulp.task( 'styles', function() {
    return gulp.src( 'src/styles/main.less' )
        .pipe( less({ paths: ['src/styles/'] }) )
        .pipe( autoprefixer( 'last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4' ) )
        .pipe( gulp.dest( 'dist/assets/css' ) )
        .pipe( rename( 'main.min.css' ) )
        .pipe( minifycss() )
        .pipe( gulp.dest( 'dist/assets/css' ) )
        .pipe( notify({ message: 'Styles task complete' }) );
} )

(...)

// watch task
gulp.task('watch', function() {

    // Watch .less files
    gulp.watch('src/styles/**/*.less', function(event) {
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
        gulp.run('styles');
    });
});

问题是,当我运行时gulp watch,它会启动任务并在styles我第一次更改.less文件时运行任务。第一次之后,我只记录了消息(File X was changed, running tasks...)。难道我做错了什么?

感谢您的任何提示或帮助!

编辑

只是根据要求提供一些信息:我正在运行Node.js 0.10.24Gulp 3.4.0。下面是提示输出的截图:

节点命令提示符运行 gulp watch 任务

4

3 回答 3

10

在@SteveLacy 建议分解我的任务部分并检查是否有任何问题导致问题之后,我得到了导致错误的非常愚蠢的错误:gulp-notify仅适用于 Mac 和 Linux,而我的操作系统是 Windows。从插件描述:

使用 node-notifier 模块将消息发送到 Mac 通知中心或 Linux 通知(使用 notify-send)。还可以指定自定义通知器(例如 Growl 通知)。

真丢人。

我遵循了一个关于 Gulp 入门的非常好的教程,并且gulp-notify是其中使用的插件之一。我的赌注没有注意插件的细节。

gulp-notify从我的 中删除后gulpfile.js,一切正常,我得到了所有正确的日志,我的gulp watch任务就像一个魅力!

简而言之: AWAYS 检查插件与您的操作系统的兼容性。

感谢所有花时间帮助我的人!

于 2014-01-29T14:49:07.040 回答
3

我遇到了同样的问题,而我的问题完全是新手问题。如果有人像我一样对 gulp 不熟悉,请确保您触发的手表功能以done()

gulp.task("watch", function() {
  gulp.watch("lib/*.js, "foobar");
});

gulp.task("foobar", function(done) {
  // This task completion was omitted.
  done();
});
于 2015-07-27T03:41:46.310 回答
0

如果我没记错的话,gulp.run 在 Gulp 3.5 版中已被弃用。尝试替换gulp.run();gulp.start();,看看是否有效。

于 2014-01-28T14:02:19.937 回答