gulpfile.js 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. var gulp = require('gulp'),
  2. concat = require('gulp-concat'),
  3. uglify = require('gulp-uglify'),
  4. rename = require('gulp-rename'),
  5. sass = require('gulp-ruby-sass'),
  6. autoprefixer = require('gulp-autoprefixer'),
  7. browserSync = require('browser-sync').create();
  8. var DEST = 'build/';
  9. gulp.task('scripts', function() {
  10. return gulp.src([
  11. 'src/js/helpers/*.js',
  12. 'src/js/*.js',
  13. ])
  14. .pipe(concat('custom.js'))
  15. .pipe(gulp.dest(DEST+'/js'))
  16. .pipe(rename({suffix: '.min'}))
  17. .pipe(uglify())
  18. .pipe(gulp.dest(DEST+'/js'))
  19. .pipe(browserSync.stream());
  20. });
  21. // TODO: Maybe we can simplify how sass compile the minify and unminify version
  22. var compileSASS = function (filename, options) {
  23. return sass('src/scss/*.scss', options)
  24. .pipe(autoprefixer('last 2 versions', '> 5%'))
  25. .pipe(concat(filename))
  26. .pipe(gulp.dest(DEST+'/css'))
  27. .pipe(browserSync.stream());
  28. };
  29. gulp.task('sass', function() {
  30. return compileSASS('custom.css', {});
  31. });
  32. gulp.task('sass-minify', function() {
  33. return compileSASS('custom.min.css', {style: 'compressed'});
  34. });
  35. gulp.task('browser-sync', function() {
  36. browserSync.init({
  37. server: {
  38. baseDir: './'
  39. },
  40. startPath: './production/index.html'
  41. });
  42. });
  43. gulp.task('watch', function() {
  44. // Watch .html files
  45. gulp.watch('production/*.html', browserSync.reload);
  46. // Watch .js files
  47. gulp.watch('src/js/*.js', ['scripts']);
  48. // Watch .scss files
  49. gulp.watch('src/scss/*.scss', ['sass', 'sass-minify']);
  50. });
  51. // Default Task
  52. gulp.task('default', ['browser-sync', 'watch']);