added task for rebuilding only scss files that change

Author: aslansky

gulpfile.js

@@ -8,6 +8,7 @@ var gulpif = require('gulp-if');
 var sass = require('gulp-sass');
 var server = require('./server');
 var bourbon = require('node-bourbon').includePaths;
+var watch = require('gulp-watch');
 
 gutil.log('Environment', gutil.colors.blue(gulp.env.production ? 'Production' : 'Development'));
 
@@ -37,6 +38,17 @@ gulp.task('styles', function () {
     .pipe(gulp.dest('./dist/css'));
 });
 
+gulp.task('watch-sass', function () {
+  return gulp.src('./src/scss/**/*.scss')
+    .pipe(watch())
+    .pipe(sass({
+      outputStyle: gulp.env.production ? 'compressed' : 'expanded',
+      includePaths: ['./src/scss'].concat(bourbon),
+      errLogToConsole: gulp.env.watch
+    }))
+    .pipe(gulp.dest('./dist/css'));
+});
+
 gulp.task('default', function() {
   gulp.env.watch = true;
   var servers = server(8080, 35729);

package.json

@@ -29,7 +29,8 @@
     "reactify": "~0.5.1",
     "tiny-lr": "0.0.5",
     "express": "~3.4.7",
-    "chokidar": "~0.8.1"
+    "chokidar": "~0.8.1",
+    "gulp-watch": "~0.5.0"
   },
   "engines": {
     "node": ">=0.10.0"

src/scss/_config.scss

@@ -0,0 +1,5 @@
+$color-red: red;
+
+p.config {
+  padding: 20px;
+}

src/scss/main.scss

@@ -56,3 +56,5 @@ a.button, button {
     }
   }
 }
+
+@import 'config';