Gulp Watch и конфликт Nodemon
За исключением этого: недавно начал использовать Gulp (конвертировать из Grunt), и я пытаюсь использовать задачу Gulp default watch (не gulp-watch от npm) для SASS/JS/HTML и gulp-nodemon (от npm), чтобы перезапустить Express сервер при изменениях. При работе с просто gulp watch
, он отлично работает; и при запуске gulp server
gulp (для nodemon), который работает нормально. Однако, используя совместно (см. Ниже в настройке задачи по умолчанию), часы не работают. Задача запущена, а на экране CLI gulp отображаются "Запуск" и "Готово" для задач просмотра, но файлы не обновляются.
Соответствующие конфигурации задач:
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 для concat'ing.
gulp.task('watch', function(){
gulp.watch(pathSource('js/application/**/*.js'), ['js:app']);
});
Задача по умолчанию, чтобы одновременно инициализировать часы gulp и nodemon:
gulp.task('default', ['watch', 'express']);
Если у кого есть идеи, спасибо заранее!
Ответы
Ответ 1
gulp.run
звонки устарели, поэтому я бы попробовал другой подход. Так как вы уже используете gulp
, могу ли я предложить попробовать gulp-nodemon?
В соответствии с документацией gulp-nodemon вы можете передать ему множество задач для выполнения:
UPDATE: Здесь полный файл 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 перезапускает ваше приложение.
EDIT: похоже, вы должны называть событие change
on- из gulp-nodemon, которое будет обрабатывать задачи компиляции до restart
триггера события restart
.
EDIT: кажется, что nodemon on('change', callback)
удаляется из их API
Ответ 2
FWIW, кажется, что использование параметра cwd в конфигурации gulp-nodemon фактически устанавливает весь culd gulp в этот каталог. Это означает, что будущие задачи будут выполняться в неправильном каталоге.
У меня была эта проблема при запуске задач gulp watch на моем внешнем сервере одновременно с задачами nodemon на моем сервере backend (в том же файле gulp), было состояние гонки, в котором, если команда nodemon была выполнена первой, встроить в (Home)/backend/frontend вместо (Home)/frontend, и оттуда все будет выглядеть грустно.
Я обнаружил, что использование параметров watch и script в gulp-nodemon обошло это (хотя все еще похоже, что nodemon просматривает весь мой проект для изменений, а не для встроенного backend-каталога).