gulp.watch() not running subsequent task(gulp.watch() 没有运行后续任务)
问题描述
在尝试将模块化 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'));
这篇关于gulp.watch() 没有运行后续任务的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:gulp.watch() 没有运行后续任务
基础教程推荐
- Chart.js 在线性图表上拖动点 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 直接将值设置为滑块 2022-01-01