S
S
Scalletta2018-07-13 19:29:46
Pug
Scalletta, 2018-07-13 19:29:46

How not to reload every page in Gulp?

Here is my gulpfile.js

var gulp       = require('gulp'),
  sass         = require('gulp-sass'),
  browserSync  = require('browser-sync'),
  concat       = require('gulp-concat'),
  uglify       = require('gulp-uglifyjs'),
  cssnano      = require('gulp-cssnano'),
  rename       = require('gulp-rename'),
  concatCss 	 = require('gulp-concat-css'),
  cache        = require('gulp-cache'),
  autoprefixer = require('gulp-autoprefixer'),
  jade				 = require('gulp-jade');


gulp.task('sass', function(){
  return gulp.src('app/sass/**/*.+(scss|sass)')
    .pipe(sass())
    .pipe(autoprefixer(['last 15 versions', '> 1%', 'ie 8'], { cascade: true }))
    .pipe(gulp.dest('app/css'))
    .pipe(browserSync.reload({stream: true}))
});



gulp.task('browser-sync', function() {
  browserSync({
    server: {
      baseDir: 'app'
    },
    notify: false
  });
});

gulp.task('scripts', function() {
  return gulp.src([
    'app/libs/**/**/*.js',
    ])
    .pipe(concat('libs.min.js'))
    .pipe(uglify())
    .pipe(gulp.dest('app/js'));
});


gulp.task('jade', function() {
  gulp.src('app/jade/pages/**/*.jade')
    .pipe(jade({
      pretty: '  ',
    }))
    .pipe(gulp.dest('app/'));
  gulp.src('app/jade/**/*.jade')
    .pipe(browserSync.stream())
});

gulp.task('watch', ['browser-sync', 'sasslibs', 'scripts'], function() {
  gulp.watch('app/sass/**/*.+(scss|sass)', ['sass']);
  gulp.watch('app/jade/**/*.jade', ['jade']);
  gulp.watch('app/*.html', browserSync.reload);
  gulp.watch('app/js/**/*.js', browserSync.reload);
});

gulp.task('default', ['watch']);

Everything works fine, but I ran into such a moment:
in general, when a multi-pager, I find the same blocks and put them in separate styles
scss
>blocks //blocks here
>tools //Variables, mixins, fonts, etc.
>pages //Pages (if some are unique
main.scss //Everything goes here
Same with jade
The moment came when there were about 40 pages.
For example, I change the sitebar that is on almost every page and everything starts to compile, as a result, every jade change has to be made wait until it compiles, everything is fine with scss is it
possible to somehow configure browserSync.reload to refresh the page after all files have changed, and not every page?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question