Я пытаюсь настроить свой файл gulpfile.js с такими функциями, как «преобразование scss в css» / watcher / live reload.
// Variables
var gulp = require('gulp');
var plugins = require('gulp-load-plugins')();
var source = './src';
var destination = './dist';
var browserSync = require('browser-sync');
// Server
gulp.task('browserSync', function(){
browserSync.init({
server: {
baseDir: 'src'
}
})
});
// Task build : Scss -> Css
gulp.task('buildCss', function () {
return gulp.src(source + '/assets/styles/*.scss')
.pipe(plugins.sass())
.pipe(plugins.cssbeautify({indent: ' '}))
.pipe(plugins.autoprefixer())
.pipe(gulp.dest(destination + '/assets/styles/'));
});
gulp.task('watch', function () {
gulp.watch(source + '/assets/styles/*.scss', gulp.series('buildCss'));
});
gulp.task('startDev', gulp.series('browserSync', 'watch'));
Сначала я создал код преобразования css, после того как сделалwatcher, и это работало хорошо, но когда я добавил часть "browserSync", это сломало все. Когда я запускаю «startDev», открывается новая вкладка, поэтому сервер запускается, я думаю, но ничего не происходит после того, как вы можете увидеть на консоли здесь: https://i.stack.imgur.com/u82Jn.png
Есть ли у вас какие-либо идеи, где может возникнуть проблемаот?
Заранее спасибо