gulp.watch не смотрит - PullRequest
Новая
       62

gulp.watch не смотрит

0 голосов
/ 14 марта 2019

Я пытаюсь автоматизировать некоторые задачи с помощью разработки тем для Gulp for Wordpress.Мне удалось заставить все работать, кроме того, что gulp.watch не отслеживает изменения в моих файлах автоматически.

Версия Gulp:

  • CLI version 2.0.1
  • Local version 3.9.1

Операционная система:

  • Windows 10

Package.json: 

{
  "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"
  }
}

Gulpfile: 

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 может быть проблемой или версией.На данный момент я не знаю.

Заранее спасибо!

1 Ответ

1 голос
/ 15 марта 2019

С окнами проблем нет, я ежедневно использую gulp для окон.

И насчет версии, я не думаю, что здесь тоже виноват, но вы все равно должны обновиться до последней версии (то есть 4.0.0).

Попробуйте использовать функцию в watch вместо task, например:

(Это то, что сделано в официальных примерах здесь , а также то, что я делаю, и это работает) 

// 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, и он как бы отслеживает, когда задача завершена. В некоторых случаях невыполнение и выполнение этого вызывает предупреждения и даже ошибки. В любом случае, делать это не повредит, на всякий случай.

...