Sass не перезагружается из браузера синхронизации - PullRequest
Новая
       304

Sass не перезагружается из браузера синхронизации

0 голосов
/ 17 апреля 2019

Я новичок в глотке и пытаюсь создать свой первый проект в одиночку. Когда я использую gulp yarn-start, задача работает. Он просматривает и преобразует index.twig в index.html и файл style.scss в style.css, но sass не запускает перезагрузку из синхронизации браузера и не обновляет изменения.

По сути, я не вижу перезагрузки sass при синхронизации браузера.

Заранее немного спасибо :)

Вот структура папок: 

dist:
 css
   style.css
 html
   index.html

 gulpfile.babel.js
   index.js

src
 markup
  index.twig
 scss
  style.scss

Это мой файл gulp, с заданием sass 

gulp.task('style', () => {
    console.log('execute sass file');

    return gulp
        .src('src/scss/styles.scss')
        .pipe(sourcemaps.init())
        .pipe(sass())
        .pipe(
            cssnano({
                discardComments: { removeAll: true },
                reduceIndents: false,
                zIndex: false
            })
        )
        .pipe(rename('styles.css'))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest('dist/css'));
});

gulp.task('sass', function () {

    return gulp.src('src/scss/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('dist/css'))
    .pipe(browserSync.reload({
        stream: true
    }));
});

gulp.task('watch', function() {
    gulp.watch('src/scss/**/*.scss', gulp.series('sass'));
    gulp.watch('src/markup/index.twig', gulp.series('twig'));
    console.log('task twig and sass works');
});

gulp.task('browser-sync', () => {
    browserSync.init({
        server: {
            baseDir: 'dist/html',
            browser: 'google chrome',
            server: 'dist',
            open: true,
        }
    });
});

gulp.task('start', gulp.parallel('browser-sync', 'watch'));

gulp.task('yarn', function() {

    return gulp.src(['./package.json'])
        .pipe(yarn());
});

gulp.task('yarn-start', gulp.parallel('yarn', 'browser-sync', 'watch'))
...