У меня есть следующий глоток, который обрабатывает мои sass, js и изображения. У меня также есть livereload на всех задачах. Он отлично работает со всеми задачами, кроме задачи изображения.
Если я помещаю или обновляю изображение в исходном каталоге, оно не перезагружается, но перезагружается для всех других задач.
Может кто-нибудь указать, что я делаю неправильно?
// Required Plugins
var gulp = require('gulp'),
connect = require('gulp-connect'),
livereload = require("gulp-livereload"),
gutil = require('gulp-util'),
notify = require('gulp-notify'),
scss = require('gulp-ruby-sass'),
sass = require('gulp-sass'),
autoprefix = require('gulp-autoprefixer'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
concat = require('gulp-concat'),
changed = require('gulp-changed'),
clean = require('gulp-clean'),
rename = require('gulp-rename'),
minifycss = require('gulp-minify-css'),
newer = require('gulp-newer'),
exec = require('child_process').exec,
sys = require('sys');
// Config
var paths = {
scss: 'site/source/scss/**/*.scss',
js: 'site/source/js/**/*.js',
images: ['site/source/images/**/*.png', 'site/source/images/**/*.gif', 'site/source/images/**/*.jpg', 'site/source/images/**/*.svg'],
html: 'site/**/*.html',
root: 'site/',
},
dests = {
css: 'site/assets/css/',
js: 'site/assets/js/',
images: 'site/assets/images/',
},
options = {
autoprefix: 'last 10 version',
imagemin: { optimizationLevel: 3, progressive: true, interlaced: true },
jshint: '',
jshint_reporter: 'default',
scss: { style: 'compressed', compass: true, require: ['compass', 'susy', 'breakpoint'] },
uglify: { mangle: false },
clean: { read: false }
};
// Clean Task
gulp.task('clean', function() {
return gulp.src([
dests.css, dests.js, dests.images
], options.clean )
.pipe( clean() );
});
// SASS
gulp.task('styles', function () {
return gulp.src( paths.scss )
.pipe( scss( options.scss ).on( 'error', gutil.log ) )
.pipe( autoprefix( options.autoprefix ) )
.pipe( gulp.dest( dests.css ) )
.pipe( connect.reload() )
.pipe( notify( { message: 'CSS task complete.' } ) );
});
// Scripts
gulp.task('scripts', function () {
return gulp.src( paths.js )
.pipe( jshint( options.jshint ) )
.pipe( jshint.reporter( options.jshint_reporter ) )
.pipe( gulp.dest( dests.js ) )
.pipe( uglify( options.uglify ) )
.pipe( concat( 'all.min.js' ) )
.pipe( gulp.dest( dests.js ) )
.pipe( connect.reload() )
.pipe( notify( { message: 'Scripts task complete.' } ) );
});
// Images
gulp.task('images', function() {
return gulp.src( paths.images )
.pipe( imagemin( options.imagemin ) )
.pipe( newer( dests.images ) )
.pipe( gulp.dest( dests.images ) )
.pipe( connect.reload() )
.pipe( notify( { message: 'Images task complete.' } ) );
});
// HTML
gulp.task( 'html', function () {
return gulp.src( paths.html )
.pipe( connect.reload() );
});
// Gulp Connect Server
gulp.task('connect', function() {
connect.server({
root: paths.root,
livereload: true
});
});
// Watch
gulp.task('watch', function () {
gulp.watch( paths.scss, ['styles'] );
gulp.watch( paths.js, ['scripts'] );
gulp.watch( paths.images, ['images'] );
gulp.watch( paths.html, ['html'] );
});
// Default task
// Note we make sure the clean task will finish before running the other tasks
gulp.task('default', ['clean'], function() {
gulp.start( 'styles', 'scripts', 'images', 'connect', 'watch' );
});