browserSync работает без файла sass - PullRequest
0 голосов
/ 28 марта 2019

browserSync работает нормально, но sass не перезагружается, и я не вижу, как мои изменения автоматически перезагружаются в браузере. По сути, он не перезагружается, когда я повторно запускаю gulp start в терминале. Я использую Gulp 4, вот мой index.js.

Помоги мне ? Спасибо!

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

    return gulp.src('src/assets/scss/styles.scss')
        .pipe(rename('css/styles.css'))
        .pipe(gulp.dest('dist/css'));
});

gulp.task('index', () => {
    console.log('execute twig');

    return gulp.src('src/markup/index.twig')
    .pipe(rename('html/index.html'))
    .pipe(gulp.dest('dist/html'))
});


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

    return gulp.src('src/markup/*.twig')
    .pipe(twig())
    .pipe(gulp.dest('dist/html'))
    .pipe(browserSync.reload({
        stream: true
    }))
});

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

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

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

    gulp.watch('src/markup/*.twig', browserSync.reload);
    gulp.watch('src/assets/scss/*.scss', browserSync.reload);
});

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

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

1 Ответ

0 голосов
/ 31 марта 2019

Измените:

gulp.watch('src/assets/scss/**/*.scss', gulp.task('style'));  

на

gulp.watch('src/assets/scss/**/*.scss', gulp.series('style'));

Вы также захотите сделать это с вашей задачей twig.

...