gulp, browsersync, sass, autoprefixer isnt working

Question

i am trying to get my gulp to work correct with Autoprefixer, sass and browser-sync but i have some issues.

I set up the Gulpfile.js like this:

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']);
})

I got this from a website. I only changes the .scss to .sass

The whole idea of what i wanted was to have a map called "scr" where i put my .sass files, and that should compile to the /assets/css folder where is should become a .css file.

I installed everything in my main directory, where my index.html, gulpfile.js and package.json is stored.

But now i am working in src/css/main.sass, after saving nothing will happen. So im guessing its not seeing any changes and will not compile? Yes i have linked the main.css within my index.html

I hope you can help me and maybe explain what went wrong so that maybe, someday i understand this.

Answer 1

modify to this :

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

and let us know if that works.

Answer 2

as were mentioned previous

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

And you forgot to set "init" after browserSync when you create server.

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