Gulp 4 browserSync reload - PullRequest
       14

Gulp 4 browserSync reload

0 голосов
/ 28 февраля 2019

У меня проблемы с browserSync. Я не могу получить триггер reload do после попытки нескольких разных методов.Сам BrowserSync запущен и работает, хотя, когда я вручную перезагружаюсь, ничего не происходит, я должен открыть новую вкладку, чтобы увидеть любые изменения.Я не совсем понимаю gulp 4, и все источники, которые я смотрел, используют совершенно разные методы.Буду признателен за любую помощь, не стесняйтесь задавать любые вопросы.

enter image description here

var gulp = require('gulp');
var sass = require('gulp-sass');
var concatcss = require('gulp-concat');
var concatjs = require('gulp-concat');
var uglifycss = require('gulp-uglifycss');
var reload = require('browser-sync').reload();
var nunjucks = require('gulp-nunjucks-render');
var browserSync = require('browser-sync').create();


sass.compiler = require('node-sass');

gulp.task('sass', function () {
 return gulp.src('./Edit/sass/*.scss')
   .pipe(sass().on('error', sass.logError))
   .pipe(gulp.dest('./Edit/css'));
});

gulp.task('concatcss', function() {
  return gulp.src('./Edit/css/*.css')
    .pipe(concatcss('style.css'))
    .pipe(gulp.dest('./Edit/css/concated/'));
});

gulp.task('concatjs', function() {
  return gulp.src('./Edit/java-script/*.js')
    .pipe(concatjs('scripts.js'))
    .pipe(gulp.dest('./Upload/js/'));
});

gulp.task('css', function () {
  return gulp.src('./Edit/css/concated/*.css')
    .pipe(uglifycss({
      "maxLineLen": 80,
      "uglyComments": true
    }))
    .pipe(gulp.dest('./upload/css'));
});

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

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

});


gulp.task('run',gulp.parallel('browserSync', gulp.series('sass','concatcss','concatjs','css')));

gulp.task('watch', function(){
    gulp.watch('./Edit/sass/*.scss',gulp.series('sass'));
    gulp.watch('./Edit/css/*.css',gulp.series('concatcss'));
    gulp.watch('./Edit/java-script/*.js',gulp.series('concatjs')); // maybe put extra task in all gulp series for browser sync
    gulp.watch('./Edit/css/concated/*.css', gulp.series('css'));

});

gulp.task('default', gulp.parallel('watch', 'run'));

1 Ответ

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

Для тех, у кого есть проблемы, вот мое решение, просто добавьте этот .on ('change', browserSync.relod) в конец нужных часов.

gulp.task('watch', function(){
    gulp.watch('./Edit/sass/*.scss',gulp.series('sass'));
    gulp.watch('./Edit/css/*.css',gulp.series('concatcss'));
    gulp.watch('./Edit/java-script/*.js',gulp.series('concatjs')); // maybe put extra task in all gulp series for browser sync
    gulp.watch('./Edit/css/concated/*.css', gulp.series('css'));
    gulp.watch('./Upload/css/*.css').on('change', browserSync.reload);
    gulp.watch('./Upload/js/*.js').on('change', browserSync.reload);

});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...