Ошибка BrowserSync в gulp 4 - PullRequest
Новая
       62

Ошибка BrowserSync в gulp 4

0 голосов
/ 13 июня 2019

Я погуглил переполнение стека. И в двух словах, мне пришлось перейти с глотка 3 на 4. Я получил это работает.

И с моим gulpfile.js я могу успешно начать проецирование на localhost: 3000.

ОДНАКО. Кажется, что BrowserSync не работает для HTML, CSS и JS.

Я не могу понять, почему. Если я отредактирую какой-нибудь css / js / html, gulp, похоже, ничего не делает для перезагрузки / обновления / public файлов ... Не уверен, где я ошибся ...

Вот мой код: 

//Importing dependencies
var gulp = require ('gulp'),
    autoprefixer = require('gulp-autoprefixer'),
    browserSync = require('browser-sync').create(),
    sass = require('gulp-sass'),
    cleanCSS = require('gulp-clean-css'),
    sourcemaps = require('gulp-sourcemaps'),
    uglify = require('gulp-uglify');

// BrowserSync
function serve(done) {
  browserSync.init({
    server: {
      baseDir: "./public"
    },
    port: 3000
  });
  done();
}

// BrowserSync Reload
function reload(done) {
  browserSync.reload();
  done();
}

//Declaring Paths
var paths = {
    styles:{
      src:'.src/scss/*.scss',
      dest: 'public/css'
    },
    custom_js:{
      src:'.src/js/*.js',
      dest: 'public/js'
    }
}

//Compiling & Moving Custom SASS
function custom_sass() {
  return gulp
    .src(paths.styles.src)
    .pipe(sourcemaps.init())
      .pipe(sass())
    .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false}))
    .pipe(cleanCSS())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(paths.styles.dest));
}

//Custom Scripts
function custom_js(){
  return gulp
    .src(paths.custom_js.src)
    .pipe(sourcemaps.init())
    .pipe(uglify())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(paths.custom_js.dest));
}

//Watching File
function watch() {
  gulp.watch(paths.styles.src, gulp.series(custom_sass,reload));
  gulp.watch(paths.custom_js.src, gulp.series(custom_js,reload));
  gulp.watch('/src/*.html', reload);
}

//Compiling & Moving stylesheets & Scripts
var files = gulp.parallel(custom_sass, custom_js);

//Building task
var build = gulp.series( files, gulp.parallel(serve, watch));
gulp.task(build);
gulp.task('default', build);
...