gulp.watch() 没有运行后续任务

2022-01-19 00:00:00 frontend javascript gulp

在尝试将模块化 gulp 任务拆分为单独的文件时遇到了一个奇怪的错误.以下应该执行任务 css，但不执行:

Running into a bizarre bug when trying to make modular gulp tasks by splitting them into separate files. The following should execute the task css, but does not:

var gulp = require('gulp');
var plugins = require('gulp-load-plugins')();

gulp.task('watch', function () {
  plugins.watch('assets/styl/**/*.styl', ['css']); // PROBLEM
});

在 plugins.watch() 中声明 ['css'] 在技术上应该接下来运行以下任务:

Declaring ['css'] in plugins.watch() should technically run the following task next:

var gulp = require('gulp');
var plugins = require('gulp-load-plugins')();

gulp.task('css', function () {
  return gulp.src('assets/styl/*.styl')
    .pipe(plugins.stylus())
    .pipe(gulp.dest('/assets/css'));
});

文件:gulpfile.js

var gulp = require('gulp');
var requireDir = require('require-dir');
requireDir('./gulp/tasks', { recurse: true });

gulp.task('develop', ['css', 'watch']);

文件夹结构

<代码>- 吞咽/- 任务/-css.js- watch.js-gulpfile.js

gulp develop 应该运行任务 css 和 watch(确实如此).在文件更改时，watch 应该检测到它们(它会)然后运行 ​​css 任务(它不会).

gulp develop should run tasks css and watch (it does). On file changes, watch should detect them (it does) and then run the css task (it's does not).

不太喜欢这个解决方案，因为 gulp.start() 在下一个版本中被弃用，但这确实解决了它:

Not terribly fond of this solution as gulp.start() is being deprecated in the next release, but this does fix it:

plugins.watch('assets/styl/**/*.styl', function() {
  gulp.start('css');
});

推荐答案

要么使用gulp的内置手表，语法如下:

Either use gulp's builtin watch with this syntax:

gulp.task('watch', function () {
  gulp.watch('assets/styl/**/*.styl', ['css']);
});

或 gulp-watch插件 使用这种语法:

gulp.task('watch', function () {
  plugins.watch('assets/styl/**/*.styl', function (files, cb) {
    gulp.start('css', cb);
  });
});

您的 gulp.dest 路径中也可能有错字.将其更改为相对:

There's also probably a typo in your gulp.dest path. Change it to relative:

.pipe(gulp.dest('assets/css'));

相关文章