gulp, browsersync, sass, autoprefixer не работает

Question

Я пытаюсь заставить мой глоток работать правильно с Autoprefixer, sass и синхронизацией с браузером, но у меня есть некоторые проблемы.

Я настроил Gulpfile.js так:

var gulp = require('gulp'),
plumber = require('gulp-plumber'),
rename = require('gulp-rename');
var autoprefixer = require('gulp-autoprefixer');
var sass = require('gulp-sass');
var browserSync = require('browser-sync');

gulp.task('browser-sync', function() {
  browserSync({
    server: {
       baseDir: "./"
    }
  });
});

gulp.task('bs-reload', function () {
  browserSync.reload();
});

gulp.task('styles', function(){
  gulp.src(['src/**/*.sass'])
    .pipe(plumber({
      errorHandler: function (error) {
        console.log(error.message);
        this.emit('end');
    }}))
    .pipe(sass())
    .pipe(autoprefixer('last 2 versions'))
    .pipe(gulp.dest('assets/css/'))
    .pipe(browserSync.reload({stream:true}))
});


gulp.task('default', ['browser-sync'], function(){
  gulp.watch("src/**/*.sass", ['styles']);
  gulp.watch("*.html", ['bs-reload']);
})

Я получил это с сайта. Я только изменяю.scss на.sass

Идея заключалась в том, чтобы у меня была карта scr, в которую я помещал мои файлы.sass, и она должна была компилироваться в папку / assets / css, где должна стать файлом.css.

Я установил все в моей главной директории, где хранятся мои index.html, gulpfile.js и package.json.

Но сейчас я работаю в src / css / main.sass, после сохранения ничего не произойдет. Так что я думаю, что он не видит никаких изменений и не будет компилироваться? Да, я связал main.css с моим index.html

Я надеюсь, что вы можете помочь мне и, возможно, объяснить, что пошло не так, чтобы, возможно, когда-нибудь я это понял.

Answer 1

Изменить на это:

var browserSync = require("browser-sync").create();

и дайте нам знать, если это работает.

Answer 2

Как упоминалось ранее

 var browserSync = require("browser-sync").create();

И вы забыли установить "init" после browserSync при создании сервера.

browserSync.init({
    server: 
    {
       baseDir: "./"
    }
});