我正在尝试使用Gulp为Wordpress主题开发自动完成一些任务。我设法让一切工作,除了gulp.watch
没有自动观察我的文件的变化。
CLI version 2.0.1
Local version 3.9.1
{
"name": "theme-development-boilerplate",
"version": "1.0.0",
"description": "A boilerplate for Theme Development automated with Gulp. Includes SASS, Bootstrap, jQuery, Normalize, Mordernizer, among other stacks",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Manuel Abascal",
"license": "MIT",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-concat": "^2.6.1",
"gulp-error-notifier": "^1.1.0",
"gulp-imagemin": "^5.0.3",
"gulp-livereload": "^4.0.1",
"gulp-sass": "^4.0.2",
"gulp-uglify": "^3.0.1"
},
"dependencies": {
"browser-sync": "^2.26.3",
"gulp-watch": "^5.0.1"
}
}
var gulp = require('gulp');
var watch = require('gulp-watch');
var imagemin = require('gulp-imagemin');
var uglify = require('gulp-uglify');
var errorNotifier = require('gulp-error-notifier');
var sass = require('gulp-sass');
var concat = require('gulp-concat');
// Logs Message
gulp.task('message', function(){
return console.log('Gulp is running...');
});
// Optimize Images
gulp.task('imageMin', function (){
gulp.src('src/images/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/images'))
});
// Minify JS
gulp.task('minify', function(){
gulp.src('src/js/*.js')
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
// Compile Sass into CSS
gulp.task('sass', function(){
gulp.src('src/sass/*.scss')
.pipe(errorNotifier.handleError(sass({outputStyle: 'compressed'})).on('error', sass.logError))
.pipe(gulp.dest('dist/css'));
});
// Scripts Concatenation
gulp.task('scripts', function(){
gulp.src('src/js/*.js')
.pipe(concat('main.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
});
gulp.task('default', ['message', 'imageMin', 'sass', 'scripts']);
gulp.task('watch', function(){
gulp.watch('src/js/*.js', ['scripts']);
gulp.watch('src/images/*', ['imageMin']);
gulp.watch('src/sass/*.scss', ['sass']);
});
当我使用命令gulp
时它就像一个魅力,但是当我运行gulp watch
时,我在控制台中得到了这个输出:
Starting 'watch'...
Finished 'watch' after 12 ms
但它并没有注意任何事情。关于如何调试这个的任何想法?我听说窗户可能是问题或版本。我不知道在这一点上。
提前致谢!
Windows没有问题,我每天都在窗户上使用gulp。
关于版本,我不认为这也是罪魁祸首,但你应该更新到最新版本(4.0.0)。
尝试使用watch
中的函数而不是task
,如下所示:
(这是官方的例子here所做的,也是我做的,它的工作原理)
// Scripts Concatenation
function transpile_scripts(cb) {
gulp.src('src/js/*.js')
.pipe(concat('main.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js'))
.on('end', cb);
}
gulp.watch('src/js/*.js', transpile_scripts)
另请注意,我将回调传递给了我的函数,并在管道完成后运行它。这个回调是由gulp隐式提供的,它可以跟踪任务何时完成。在某些情况下,不传递和执行此操作会导致警告甚至错误。无论如何,为了以防万一,这样做不会有害。