GULP и BrowserSync не обновляет .scss на лету

Столкнулся с проблемой, имею HTML и SCSS файлы, сборка настроена, но есть следующий баг.

Если изменяю HTML (напр меняю заголовок страницы), нажимаю CTRL+S, наблюдатель видит изменения и обновляет контент в окне браузера. Ок

Если изменяю SCSS (напр меня цвет ссылки с #fff на #000), нажимаю CTRL+S, наблюдатель молчит и в окне браузер тоже тишина.

Если остановить GULP и снова запустить (терминал VS Code), то Все изменения отображаются в браузере.

Как сделать так, что бы при сохранении scss в исходниках, отлавливалось изменение и выводилось в окно браузера без принудительного перезапуска gulp?

Для информативности фрагмент gulpfile.js

import { scss } from "./gulp/tasks/scss.js";
###
function watcher(){
    gulp.watch(path.watch.scss, scss);
}
###
const mainTasks = gulp.parallel(copy, html, scss, js, images);

// Построение сценариев выполнения задач
const dev = gulp.series(reset, mainTasks, gulp.parallel(watcher, server));

// Выполнения сценария поумолчанию
gulp.task('default', dev);

Ниже, фрагмент путей

// Получаем имя папки проекта
import * as nodePath from 'path';
const rootFolder = nodePath.basename(nodePath.resolve());

const buildFolder = `./dist`;
const srcFolder = `./src`;

export const path = {
    build: {
        css: `${buildFolder}/css/`
    },
    src: {
        scss: `${srcFolder}/scss/style.scss`
    },
    watch: {
        scss: `${srcFolder}scss/**/*.scss`
    }

А это фрагмент самой задачи с пайпами:

const sass = gulpSass(dartSass);

export const scss = () => {
    return app.gulp.src(app.path.src.scss, { sourcemaps: true })
        .pipe(sass({
            outputStyle: 'expanded'
        }))
        .pipe(rename({
            extname: '-min.css'
        }))
        .pipe(app.gulp.dest(app.path.build.css))
        .pipe(app.plugins.browsersync.stream());
}

В чем может быть причина? При необходимости я Апдейтну код, которого не хватает для разбора. Позволю себе напомнить, что изменения работают если gulp остановит->запустить


Ответы (0 шт):