Question

我有这样的事情：

stylus/
    dashboard.styl
    default.styl

它比这复杂得多，但试图达到目的。

（例如）在dashboard.styl内，我 @require d default.styl。当我对default.styl进行任何更改或修改时， Gulp （或 gulp-watch 或任何应该执行的操作）都不会重新编译相关文件。

当我说依赖文件时，我的意思是dashboard.styl。

我认为dashboard.styl default.styl为 @require 取决于default.styl;所以，当它被改变时，dashboard.styl也应该得到改变。但 gulp-watch 并不理解这一点。

问题： 如何重新编译需要更改文件的文件？

一些其他信息

gulpfile.js

;!( function( w ) {

    'use strict';

    var gulp = require( 'gulp' ),
        stylus = require( 'gulp-stylus' ),

        watch = require( 'gulp-watch' ),

        plumber = require( 'gulp-plumber' ),

        stylusPath = 'public/stylus',
        cssPath = 'public/css';

    gulp.task( 'default', function() {

        gulp.src( stylusPath + '/*.styl' ).pipe( plumber() ).pipe( watch( stylusPath + '/*.styl' ) ).pipe( stylus({

            compress: true

        }) ).pipe( gulp.dest( cssPath ) );

    });

})( module );

我现在如何手动执行此操作：

当我对default.styl进行一些更改时，我将转到命令提示符，停止当前正在运行的任务，并使用gulp命令重新运行它。它让gulp在第一步编译所有文件，这就是我想要的（澄清：我必须要这个！没有其他选择）。

什么不是答案：我不想

在每次更改时编写一些内容来编译我的所有文件。
手动编译我的文件。

我需要有人告诉我有方法来实现这一目标以及如何做到这一点。感谢。

Answer 1

这可能不是你想要的，但这就是我将如何完成你想要做的事情。我将创建两个单独的gulp任务，一个用于监视，一个用于编译。类似于我的吼叫。这样，只要在您在watch任务中指定的stylus文件夹中更改了手写笔文件，它就会重新运行gulp stylus编译任务。

＆＃13;

//Watch said files
gulp.task('watch', function() {
  watch('/stylus-folder/', function() { gulp.start('stylus'); });
});

//run task when files are changed
gulp.task('stylus', function () {
  gulp.src(stylusPath + '/*.styl')
     .pipe(plumber() )
     .pipe(stylus({
        compress: true
      }))
     .pipe(gulp.dest(cssPath ));
});

＆＃13;

通过Gulp重新编译相关的Stylus文件

1 个答案: