[英]gulp-watch, gulp-watch-less don't fire
按照記錄在案的例子后,我無法通過gulp-watch或gulp-watch-less來解決問題。 我最初的問題是lazypipe(這里沒有顯示),但在我看來,我在使用插件的方式上做錯了。 這是我愚蠢的代碼仍然無法正常工作。
請注意,我嘗試使用普通的gulp-watch,它表現出完全相同的問題:它不會在更改時觸發后續管道。 如果出現問題,我會在這里附上信息。
這是我的gulpfile。
var debug = require ( 'gulp-debug' );
var gulp = require ( 'gulp' );
var less = require ( 'gulp-less' );
var watchLess = require ( 'gulp-watch-less' );
gulp.task ( 'dev-watch', function () {
// main.less just imports child less files
gulp.src ( './app/styles/less/main.less' )
.pipe ( watchLess ( './app/styles/less/main.less' ) )
.pipe ( debug () );
.pipe ( less () )
.pipe ( gulp.dest ( './app/styles' ) )
;
});
當我啟動任務時,它會執行並完美地生成預期的文件。 我看到調試輸出流信息也很好。
當我更改文件時,我看到watchLess正在接受更改:
[10:49:54] LESS saw child.less was changed
[10:49:54] LESS saw child.less was changed
[10:49:54] LESS saw main.less was changed:by:import
[10:49:54] LESS saw main.less was changed:by:import
但是,較少的任務不會執行。 它似乎沒有發出任何東西,因為調試不會觸發。
這是相關的package.json信息:
"devDependencies": {
"gulp": "^3.8.7",
"gulp-less": "^1.3.6",
"gulp-watch": "^1.2.0",
"gulp-watch-less": "^0.2.1"
}
您的代碼僅在管道中運行觀察程序,但不會告訴您該怎么做。
工作示例應如下:
var
gulp = require('gulp'),
debug = require ('gulp-debug'),
less = require ( 'gulp-less'),
watchLess = require('gulp-watch-less');
gulp.task('dev-watch', function () {
watchLess('./app/styles/less/main.less')
.pipe (debug ())
.pipe(less())
.pipe(gulp.dest('./app/styles'))
});
但是,您也可以使用gulp-watch或gulp(gulp.watch)來做同樣的事情。
這一定是最好的解決方案,我在gulp-less github中獲得自述文件; https://github.com/plus3network/gulp-less https://github.com/gulpjs/gulp/blob/master/docs/recipes/combining-streams-to-handle-errors.md npm i stream-combiner2 --save-dev
var combiner = require('stream-combiner2');
var combined = combiner.obj([
gulp.src(srcs),
less(),
autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}),
isDev ? null : cleanCss(),
gulp.dest(targetDir + 'css/multi/'),
].filter(v => v));
// any errors in the above streams will get caught
// by this listener, instead of being thrown:
combined.on('error', console.error.bind(console));
combined.on('end', () => {}); //done have been call when return combined;
return combined;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.