gulpfile.js

(function() {
  var gulp = require('gulp');
  var $ = require('gulp-load-plugins')();
  var tslint = require('gulp-tslint');

  var appDev = './src/main/webapp/';
  var appProd = './src/main/webapp/dist/';

  /* Mixed */
  var ext_replace = require('gulp-ext-replace');

  /* CSS */
  var postcss = require('gulp-postcss');
  var sourcemaps = require('gulp-sourcemaps');
  var autoprefixer = require('autoprefixer');
  var precss = require('precss');
  var cssnano = require('cssnano');

  /* JS & TS */
  var typescript = require('gulp-typescript');

  /* Images */
  var imagemin = require('gulp-imagemin');

  var tsProject = typescript.createProject('src/main/webapp/ts/tsconfig.json');

  gulp.task('build-css', function() {
    return gulp.src(appDev + 'scss/*.scss')
      .pipe(sourcemaps.init())
      .pipe(postcss([precss, autoprefixer, cssnano]))
      .pipe(sourcemaps.write('.'))
      .pipe(ext_replace('.css'))
      .pipe(gulp.dest(appProd + 'css/'))
      .pipe($.size({'title': 'css'}));
  });

  gulp.task('build-ts', function() {
    var result = gulp.src([appDev + 'ts/**/*.ts'])
    .pipe(tslint())
    .pipe(tslint.report("verbose"))
    .pipe(sourcemaps.init())
    .pipe(typescript(tsProject));

    // pipe the js files to dist folder
    result.dts.pipe(gulp.dest(appProd + 'js'));

    return result.js
      .pipe(sourcemaps.write('.'))
      .pipe(gulp.dest(appProd + 'js'))
      .pipe($.size({'title': 'ts'}));
  });

  gulp.task('build', [
    'build-ts', 'build-css', 'build-img', 'build-fonts', 'build-locale'
  ], function() {
    return gulp.src(appDev + 'index.html')
      .pipe($.useref({'searchPath': './'}))
      .pipe(gulp.dest(appProd))
      .pipe($.size({'title': 'html'}));
  });

  gulp.task('build-img', function() {
    return gulp.src(appDev + 'img/**/*')
      .pipe(imagemin({progressive: true}))
      .pipe(gulp.dest(appProd + 'img/'));
  });

  gulp.task('build-fonts', function() {
    return gulp.src(appDev + 'fonts/**/*')
      .pipe(gulp.dest(appProd + 'fonts/'));
  });

  gulp.task('build-locale', function() {
    return gulp.src(appDev + 'locale/**/*')
      .pipe(gulp.dest(appProd + 'locale/'));
  });

  gulp.task('clean', function() {
    return gulp.src(appProd, {read: false})
      .pipe($.clean());
  });

  gulp.task('watch', function() {
    gulp.watch(appDev + '**/*.ts', ['build-ts']);
    gulp.watch(appDev + 'scss/**/*.scss', ['build-css']);
    gulp.watch(appDev + 'img/*', ['build-img']);
  });

  gulp.task('default', ['build-html']);
}())