gulpfile.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. var gulp = require('gulp');
  2. var browserSync = require('browser-sync');
  3. var filter = require('gulp-filter');
  4. var sass = require('gulp-ruby-sass');
  5. var sourcemaps = require('gulp-sourcemaps');
  6. var reload = browserSync.reload;
  7. var src = {
  8. scss: 'app/scss/*.scss',
  9. css: 'app/css',
  10. html: 'app/*.html'
  11. };
  12. /**
  13. * Kick off the sass stream with source maps + error handling
  14. */
  15. function sassStream () {
  16. return sass('app/scss', {sourcemap: true})
  17. .on('error', function (err) {
  18. console.error('Error!', err.message);
  19. })
  20. .pipe(sourcemaps.write('./', {
  21. includeContent: false,
  22. sourceRoot: '/app/scss'
  23. }));
  24. }
  25. /**
  26. * Start the Browsersync Static Server + Watch files
  27. */
  28. gulp.task('serve', ['sass'], function() {
  29. browserSync({
  30. server: "./app"
  31. });
  32. gulp.watch(src.scss, ['sass']);
  33. gulp.watch(src.html).on('change', reload);
  34. });
  35. /**
  36. * Compile sass, filter the results, inject CSS into all browsers
  37. */
  38. gulp.task('sass', function() {
  39. return sassStream()
  40. .pipe(gulp.dest(src.css))
  41. .pipe(filter("**/*.css"))
  42. .pipe(reload({stream: true}));
  43. });
  44. /**
  45. * Default task
  46. */
  47. gulp.task('default', ['serve']);