Gulp Watch и Nodemon конфликт

Question

Вкратце: недавно начал использовать Gulp (конвертировать из Grunt), и я пытаюсь использовать обе задачи наблюдения по умолчанию Gulp (не gulp-watch из npm) для SASS/JS/HTML и gulp-nodemon (из npm) для перезапуска Express сервер при изменениях. Когда работает только gulp watchработает нормально; и когда работает gulp server (для nodemon), который работает нормально. Однако, используя оба вместе (как показано ниже в конфигурации задачи по умолчанию), механизм наблюдения не работает. Задача выполняется, и на CLI отображается сообщение "Запуск" и "Завершено" для задач наблюдения, но файлы не обновляются.

Соответствующие конфигурации задач:

Concat Javascript:

    gulp.task('js:app', function(){
        return gulp.src([
            pathSource('js/application/modules/**/*.js'),
            pathSource('js/application/_main.js')
        ])
        .pipe(concat('application.js'))
        .pipe(gulp.dest('./build/assets/js')).on('error', utils.log);
    });

Nodemon, перезапустите изменения в экспресс-приложении:

    gulp.task('express', function(){
        return nodemon({script:'server.js', ext:'js', cwd: __dirname + '/express', legacyWatch: true})
        .on('restart', function(){
            //gulp.run('watch'); // doesn't work :(
        });
});

Наблюдайте за изменениями в javascript и запускайте js:app для соединения.

    gulp.task('watch', function(){
      gulp.watch(pathSource('js/application/**/*.js'), ['js:app']);
    });

Задача по умолчанию, чтобы инициализировать gulp watch и nodemon одновременно:

    gulp.task('default', ['watch', 'express']);

Если у кого есть идеи, заранее спасибо!

Answer 1

gulp.run вызовы устарели, поэтому я бы попробовал другой подход. Поскольку вы уже используете gulp Могу ли я предложить попробовать gulp-nodemon?

Согласно документации gulp-nodemon, вы можете передать ей массив задач для выполнения:

ОБНОВЛЕНИЕ: вот полный gulpfile.js файл вместе с рабочим образцом на github.

'use strict';

// Main dependencies and plugins
var gulp = require('gulp');
var jshint = require('gulp-jshint');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var nodemon = require('gulp-nodemon');

var assets = 'assets/js/**/*.js';
var publicDir = 'public/javascripts';

// Lint Task
gulp.task('lint', function () {
  return gulp.src(assets)
    .pipe(jshint())
    .pipe(jshint.reporter('jshint-stylish'));
});

// Concatenate and minify all JS files
gulp.task('scripts', function () {
  return gulp.src(assets)
    .pipe(concat('global.js'))
    .pipe(gulp.dest(publicDir))
    .pipe(rename('global.min.js'))
    .pipe(uglify())
    .pipe(gulp.dest(publicDir));
});

// Watch Files For Changes
gulp.task('watch', function () {
  gulp.watch(assets, ['lint', 'scripts']);
});

gulp.task('demon', function () {
  nodemon({
    script: 'server.js',
    ext: 'js',
    env: {
      'NODE_ENV': 'development'
    }
  })
    .on('start', ['watch'])
    .on('change', ['watch'])
    .on('restart', function () {
      console.log('restarted!');
    });
});

// Default Task
gulp.task('default', ['demon']);

Таким образом, вы порождаете watch Задача при запуске nodemon и убедитесь, что watch Задача снова запускается всякий раз, когда nodemon перезапускает ваше приложение.

РЕДАКТИРОВАТЬ: кажется, вы должны звонить на change событие от gulp-nodemon, которое будет обрабатывать задачи компиляции до restart триггеры событий.

РЕДАКТИРОВАТЬ: Кажется, нодмонов on('change', callback) удаляется из их API

Answer 2

FWIW, кажется, что использование параметра cwd в конфигурации gulp-nodemon фактически устанавливает весь gulp cwd в этот каталог. Это означает, что будущие задачи будут выполняться не в том каталоге.

У меня была эта проблема при запуске задач gulp watch на моем внешнем сервере одновременно с задачами nodemon на моем внутреннем сервере (в том же файле gulpfile), было условие состязания, при котором, если команда nodemon выполнялась первой, материал внешнего интерфейса фактически выполнялся встроить в (Home)/backend/frontend вместо (Home)/frontend, и оттуда все будет в форме груш.

Я обнаружил, что использование параметров watch и script в gulp-nodemon обошло эту проблему (хотя все равно похоже, что nodemon следит за изменениями всего моего проекта, а не встроенного внутреннего каталога).