問題描述
我遇到了 gulp 的問題.我運行 gulp-watch 以及 gulp-less 和 gulp-clean.一切運行良好.
I'm having a problem with gulp. I run gulp-watch along with gulp-less and gulp-clean. Everything is running perfectly.
當我編輯 somefile.less 并保存它時缺少分號，或者我不小心留下了尾隨 ;s，我的代碼中出現錯誤時保存時，gulp-less 在控制臺中記錄一個錯誤.在我修復它之后 gulp-watch 繼續觀看文件，但 gulp-less 不會觸發并且它不會編譯.當我停止 gulp 并在終端中再次運行它時，一切恢復正常.
When I edit somefile.less and I save it with a semi-colon missing or maybe I accidentally leave a trailing ;s, just have errors in my code when saving, gulp-less logs an error in the console. After I fix it gulp-watch continues watching the files, but gulp-less doesn't fire and it doesn't compile. When I stop gulp and run it again in the terminal everything goes back to normal.
這是我的 gulpfile.js:
var gulp = require('gulp');
var clean = require('gulp-clean');
var gutil = require('gulp-util');
var less = require('gulp-less');
var watch = require('gulp-watch');
var path = require('path');
gulp.task('clean', function() {
return gulp.src('src/main/webapp/styles/build', {read: false})
.pipe(clean().on('error', gutil.log))
});
gulp.task('less', function() {
return gulp.src(['src/main/webapp/styles/main.less'], {base: 'src/main/webapp/styles/'})
.pipe(less().on('error', gutil.log))
.pipe(gulp.dest('src/main/webapp/styles/build'))
.on('error', gutil.log);
});
gulp.task('watch', function() {
watch('src/main/webapp/styles/**/*.{less, css}', function() {
gulp.start('less')
.on('error', gutil.log);
})
});
gulp.task('default', ['clean'], function() {
gulp.start(['less', 'watch'])
.on('error', gutil.log);
});
這是我的 devDependencies:
"devDependencies": {
"gulp": "^3.8.10",
"gulp-clean": "^0.3.1",
"gulp-less": "^2.0.1",
"gulp-util": "^3.0.2",
"gulp-watch": "^3.0.0"
}
最后，這是控制臺中的消息:
Finally, here is the message in the console:
[10:21:03] imports/productSearchPage.less was changed
[10:21:03] Starting 'less'...
[10:21:03] { [Error: Unrecognised input. Possibly missing something in file /src/main/webapp/styles/imports/productSearchPage.less line no. 1008]
type: 'Parse',
filename: '/src/main/webapp/styles/imports/productSearchPage.less',
index: 19127,
line: 1008,
callLine: NaN,
callExtract: undefined,
column: 0,
extract: [ '', '', undefined ],
message: 'Unrecognised input. Possibly missing something in file /src/main/webapp/styles/imports/productSearchPage.less line no. 1008',
stack: undefined,
lineNumber: 1008,
fileName: '/src/main/webapp/styles/imports/productSearchPage.less',
name: 'Error',
showStack: false,
showProperties: true,
plugin: 'gulp-less',
__safety: { toString: [Function] } }
[10:21:04] imports/productSearchPage.less was changed
[10:21:08] imports/productSearchPage.less was changed
^C
您能否告訴我 gulp-watch 任務有什么問題，并幫助我在刪除錯誤后使其運行 gulp-less，而無需重新啟動 <代碼>gulp.
Can you please tell me what is wrong with the gulp-watch task and help me make it run gulp-less after the errors have been removed, without restarting gulp.
我編輯的 gulp-less 任務
gulp.task('less', function() {
return gulp.src(['src/main/webapp/styles/main.less'], {base: 'src/main/webapp/styles/'})
.pipe(less().on('error', gutil.log))
.pipe(gulp.dest('src/main/webapp/styles/build'))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
});
});
推薦答案
現在可以了！這是我最后的工作，gulp-less 任務:
It works now! Here is my final, and working, gulp-less task:
gulp.task('less', function() {
return gulp.src(['src/main/webapp/styles/main.less'], {base: 'src/main/webapp/styles/'})
.pipe(less().on('error', function(err){
gutil.log(err);
this.emit('end');
}))
.pipe(gulp.dest('src/main/webapp/styles/build'))
});
問題是，當 LESS 中出現錯誤時，任務仍然繼續并構建目標文件.最重要的是，我放置了錯誤記錄函數和 emit('end') 作為對 gulp.dest 的回調.
The problem was that, when there was an error in the LESS the task still went on and built the destination file. On top of that I placed the error logging function and the emit('end') as a callback to gulp.dest.
現在，當 less() 的回調是錯誤日志并且 emit('end') 一切正常.
Now, when the callback of less() is the error log and emit('end') everything works perfectly.
這篇關于在 LESS 文件中出現錯誤后，Gulp.js 停止編譯 LESS的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！