css - Gulp sass compiles to wrong directory only when triggered by gulp watch -

this 1 has me scratching head sure. have project set so

. ├── app |   └── styles |          ├── foundation |          |       └── foundatipn.scss |          └── app.scss ├── build |   └── styles └         └── app.css 

my gulp-sass task compiles app.scss correct , places final file in build.styles.

however, when sass task triggered gulp watch puts css file in app/styles/. still compiles correct file build/styles.

relevant code below

var gulp = require('gulp'),     browsersync = require('browser-sync').create(),     notify = require('gulp-notify'),     include = require('gulp-include'),     autoprefixer = require('gulp-autoprefixer'),     sass = require('gulp-ruby-sass'),     sourcemaps  = require('gulp-sourcemaps'),     cssnano = require('gulp-cssnano'),     browserify = require('browserify'),     source = require('vinyl-source-stream'); var reload = browsersync.reload; var dest = './build'; var src = './app';  gulp.task("sass", function(cb){     //compile foundation scss css     var stream = sass('app/styles/app.scss',{         loadpath: ['app/styles/foundation'],         })         //.pipe(notify("compiling scss, autoprefixeing, minifying , creating sourcemaps"))         .pipe(sourcemaps.init())         .pipe(autoprefixer({             browsers: ['last 2 versions', 'ie >= 9', 'and_chr >= 2.3']         }))         .pipe(cssnano())         .pipe(sourcemaps.write('/'))         .pipe(gulp.dest(dest + '/styles'))         .pipe(reload({stream: true}));     return stream; });  gulp.task('watch', function(){     gulp.watch('app/**/*.html', ['markup']);     gulp.watch('app/styles/**/*.scss', ['sass']);     gulp.watch('app/scripts/**/*.js',['js']);     gulp.watch('app/images/**/*.png', ['images']); });