Mary Yacoubian
Mary Yacoubian

Reputation: 216

Gulp tasks appear to be running twice, instead of once

Problem

My gulp tasks seem to be running twice instead of once, trying to fix thatI think some have suggested that the culprit might lie in the default task in Gulpfile.js

Gulpfile.js

// Include Gulp
var gulp = require('gulp');

// All of your plugins
var autoprefixer = require('gulp-autoprefixer');
var imagemin = require('gulp-imagemin');
var jshint = require('gulp-jshint');
var livereload = require('gulp-livereload');
var minify = require('gulp-minify-css');
var notify = require('gulp-notify');
var rename = require('gulp-rename');
var sass = require('gulp-sass');
var uglify = require('gulp-uglify');
var watch = require('gulp-watch');

// Compile CSS, Autoprefix
gulp.task('styles', function() {
  return gulp.src('assets/css/style.scss')
    .pipe(sass({ style: 'expanded' }))
    .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
    .pipe(gulp.dest('assets/css'))
    // .pipe(rename({suffix: '.min'}))
    // .pipe(minify())
    .pipe(gulp.dest('assets/css'))
    .pipe(notify({ message: "Watson: I've organized your files for you." }));
});

// Lint, Concatenate and Minify JavaScript
gulp.task('scripts', function() {
  return gulp.src('assets/js/scripts.js')
    .pipe(jshint())
    .pipe(jshint.reporter('default'))
    // .pipe(concat('scripts.js'))
    .pipe(gulp.dest('assets/js'))
    // .pipe(rename({suffix: '.min'}))
    // .pipe(uglify())
    .pipe(gulp.dest('assets/js'))
    .pipe(notify({ message: "Watson: I've done your dirty laundry." }));
});

// Watch files for changes
gulp.task('watch', function() {
    gulp.watch('assets/js/*.js', ['scripts', 'styles']);
    gulp.watch('assets/css/**/*.scss', ['styles']);
});

// Default Task
gulp.task('default', function() {
    gulp.start('styles', 'scripts', 'watch');
});

Terminal

[18:53:57] Using gulpfile ~/Desktop/Projects/legislature/Gulpfile.js
[18:53:57] Starting 'default'...
[18:53:57] Starting 'styles'...
[18:53:57] Starting 'scripts'...
[18:53:58] Starting 'watch'...
[18:53:58] Finished 'watch' after 26 ms
[18:53:58] Finished 'default' after 49 ms
[18:53:58] gulp-notify: [Gulp notification] Watson: I've organized your files for you.
[18:53:58] Finished 'styles' after 262 ms
[18:53:58] gulp-notify: [Gulp notification] Watson: I've done your dirty laundry.
[18:53:58] Finished 'scripts' after 256 ms
[18:53:58] Starting 'scripts'...
[18:53:58] Starting 'styles'...
[18:53:58] gulp-notify: [Gulp notification] Watson: I've done your dirty laundry.
[18:53:58] Finished 'scripts' after 232 ms
[18:53:58] gulp-notify: [Gulp notification] Watson: I've organized your files for you.
[18:53:58] Finished 'styles' after 232 ms

Upvotes: 1

Views: 1842

Answers (2)

atilkan
atilkan

Reputation: 5008

Your problem is: you have two identical line that saves the file and triggers twice.

In your scripts task

.pipe(gulp.dest('assets/js'))

Other possible problem for newcomers.
I write here my experience maybe helps somebody.

I use Dropbox for my project and work there. When Dropbox is open, tasks run twice because Dropbox detects file change and does something. Specially Typescript files, i don't know why.

Upvotes: 1

Heikki
Heikki

Reputation: 15417

Your scripts task writes to the same folder that watch task is watching. Watch then runs the scripts and styles tasks as specified:

gulp.watch('assets/js/*.js', ['scripts', 'styles']);

Upvotes: 1

Related Questions