CODEWITHSUNDEEP
npmgulp
Hellodan
Hellodan

Reputation: 1208

Trying to get gulp notify to work and tell me things are running and updating

I am currently struggling to get gulp notify to display a success notification when I run my gulp watch command from terminal so that I know the command is running and the files have been compiled to the dist directory I have created.

I am very new to gulp and reading the docs on notify isn't 100% easy for me to understand or clear to me what I am doing wrong.

currently the code looks a bit like this...

var gulp       = require('gulp'),
    gutil      = require('gulp-util'),
    jshint     = require('gulp-jshint'),
    uglify     = require('gulp-uglify'),
    sass       = require('gulp-sass'),
    concat     = require('gulp-concat'),
    sourcemaps = require('gulp-sourcemaps'),
    pump       = require('pump'),
    notify     = require('gulp-notify'),
    plumber    = require('gulp-plumber'),
    growl      = require('growl'),

   input  = {
      'sass': 'scss/**/*.scss',
      'javascript': 'js/**/*.js'
   },

   output = {
      'stylesheets': 'dist/styles',
      'javascript': 'dist/javascript'
   };

gulp.task('build-js', function() {
  return gulp.src(input.javascript)
    .pipe(sourcemaps.init())
      .pipe(concat('test.js'))
      //only uglify if gulp is ran with '--type production'
      .pipe(gutil.env.type === 'production' ? uglify() : gutil.noop())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(output.javascript));
});

gulp.task('build-css', function() {
  return gulp.src('scss/**/*.scss')
    .pipe(sourcemaps.init())
      .pipe(sass())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(output.stylesheets));
});

gulp.task('watch', function() {
  notify("Watching for changes...").write('');
  gulp.watch(input.javascript, ['jshint', 'build-js']);
  gulp.watch(input.sass, ['build-css']);
  .pipe(notify({
      message: "Generated file: <%= file.relative %> @ <%= options.date %>",
      templateOptions: {
        date: new Date()
      }
    }))
});

Upvotes: 0

Views: 234

Answers (1)

Hellodan
Hellodan

Reputation: 1208

I've managed to get it working by changing the watch task to the following

  gulp.task('watch', function() {
  notify("Watching for changes...").write('');
  gulp.watch(input.javascript, ['jshint', 'build-js']);
  gulp.watch(input.sass, ['build-css']);

  gulp.watch([
          'dist/**/*'
      ]).on('change', function () {
          notify("Files updated").write('');
      });
});

Upvotes: 1

Related Questions