А если точнее, то изменения в scss, js файлах он нормально отслеживает. А img, fonts - надо по команде вызывать... То есть я бросаю картинку в папку img, она должна автоматически оказатся в папке dist, но изменения не отслеживаются. Помогите плз.
Мой gulpfile:
var gulp = require('gulp');
sass = require('gulp-sass');
imagemin = require('gulp-imagemin');
pngquant = require('imagemin-pngquant');
cache = require('gulp-cache');
spritesmith = require('gulp.spritesmith');
merge = require('merge-stream');
sourcemaps = require('gulp-sourcemaps');
autoprefixer = require('gulp-autoprefixer');
browserSync = require('browser-sync').create();
rigger = require('gulp-rigger');
gulp.task('sass', function() {
return gulp.src('src/sass/**/*.+(sass|scss)')
.pipe(sourcemaps.init())
.pipe(sass({outputStyle: 'expanded'}).on('error', sass.logError))
.pipe(autoprefixer({
browsers: ['last 10 versions'],
cascade: false
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('dist/css'))
.pipe(browserSync.stream());
});
gulp.task('html', function () {
return gulp.src('src/*.html')
.pipe(rigger())
.pipe(gulp.dest('dist'))
.pipe(browserSync.stream());
});
gulp.task('js', function () {
return gulp.src('src/js/**/*.js')
.pipe(gulp.dest('dist/js'))
.pipe(browserSync.stream());
});
gulp.task('fonts', function () {
return gulp.src('src/fonts/**/*')
.pipe(gulp.dest('dist/fonts'))
.pipe(browserSync.stream());
});
gulp.task('img', function() {
return gulp.src('src/img/**/*')
.pipe(cache(imagemin({
interlaced: true,
progressive: true,
svgoPlugins: [{removeViewBox: false}],
use: [pngquant()]
})))
.pipe(gulp.dest('dist/img'))
.pipe(browserSync.stream());
});
gulp.task('sprite', function () {
var spriteData = gulp.src('src/sprite/*.png').pipe(spritesmith({
imgName: '../img/sprite.png',
cssName: 'sprite.scss'
}));
var imgStream = spriteData.img
.pipe(gulp.dest('src/img/'));
var cssStream = spriteData.css
.pipe(gulp.dest('src/sprite/'));
return merge(imgStream, cssStream);
});
gulp.task('watch', function() {
gulp.watch('src/*.html', ['html']);
gulp.watch('src/sass/**/*.+(sass|scss)', ['sass']);
gulp.watch('src/fonts/**/*', ['fonts']);
gulp.watch('src/js/**/*.js', ['js']);
gulp.watch('src/img/**/*', ['img']);
gulp.watch('src/sprite/**/*.png', ['sprite']);
});
gulp.task('default', ['watch']);
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости